/*******公共样式*start*/ 
header.mui-bar{
    border: 0;
    background-color: initial;
    .mui-title{
        color: #333333;
        font-size: 0.9rem;
    }
    .mui-icon{
        color: #000000;
    }
    .mui-icon-closeempty{
        font-size: 2rem;
        padding-top: 0.1rem;
        padding-bottom: 0.1rem;
    }
}
.rdntn.rmcolor{
    background-color: #ccc;
}
.img-look.active, .img-cut.active{
    display: block;
}
.voice-lading{//语音等待
    display: none;
    z-index: 999999;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: url(../images/voice-gif.gif) center 90% no-repeat;
    background-size: 8.125rem 6.25rem;
}
#loging{//聊天等待
    width: 100%;
    height: 2rem;
    background: url(../images/loging.gif) center no-repeat;
    background-size: 1rem;
    text-align: center;
    color: #8F8F94;
    font: .7rem/1.5 "";
}
.img-look, .img-cut{
    display: none;
    z-index: 99999;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: #000;
    .img-look-box, .img-cut-box{
        width: 100%;
        height: 100%;
        display: flex;
        display: -webkit-flex;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .img-cut-box {
        height: 90%;
    }
    .img-cut-opt {
        width: 100%;
        height: 10%;
    }
    img,video{
        opacity: 1;
//      position: relative;
//      top: 50%;
//      left: 50%;
        max-width: 100%;
        max-height: 100%;
//      transform: translate(-50%,-50%);
    }
    .img-cut-box img{
        max-height: none;
    }
    video.active{
        opacity: 0;
    }
}
#vdo-loding{//视频等待
    position: absolute;
    z-index: 9;
    top: 50%;
    left: 50%;
    width: 2rem;
    height: 2rem;
    margin-left:-1rem ;
    margin-top:-1rem ;
    background: url(../images/vdo_lodi.gif) no-repeat center;
    background-size:1rem;
}
#loging.ovr{
    background: transparent;
}
header.header-color{
    background-color: #fff;
    .mui-pull-right{
        color:#d93b2a ;
    }
}
.colorheader header.header-color{
    background-color: #fff;
    .mui-title,.mui-icon{
        color: #d93b2a;
    }
}
.rdntn{
    background-color: #d93b2a;
    box-shadow: 0px 5px 13px 0px  rgba(0, 0, 0, 0.3);
    border-radius: 40px;
    color: #ffffff;
}
.promit{
    z-index: 9999;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.popover,.popover2,.popover-img{
    z-index: 9999;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.popover-img,.popover2{
    background-color: rgba(0,0,0,.5);
}
.table-view{
    position: fixed;
    left: 5%;
    bottom: 50%;
    width: 90%;
    padding: 0.5rem 0.5rem 0 0.5rem;
    z-index: 999999;
    transform: translate(0 ,50%);
     -webkit-transform: translate(0 ,50%);
    background-color: rgba(0, 0, 0, 0.75);
    box-shadow: 0px 10px 26px 0px rgba(0, 0, 0, 0.38);
    border-radius: 10px;
    display: none;
    .table-view-cell{
        width: 100%;
        border-radius: 0.5rem;
        font: 0.8rem /2.5rem "";
        a.table-view-cell-a{
            display: block;
            color: #fff;
            border-bottom: 1px solid #000;
            padding:0 1rem ;
        }
        a.table-view-cell-cancel,a.table-view-cell-affirm{
            border: 0;
            text-align: end;
            font: 0.62rem /2.5rem "";
            padding:0 1.5rem;
            float: right;
            width: auto;
        }
        em.ocheckbox{
            display: inline-block;
            width: 1rem;
            height: 1rem;
            background: url(../images/juxing.png) 0 0 no-repeat;
            background-size: 0.85rem;
            vertical-align: middle;
            margin-right: 0.75rem;
        }
        .table-view-cell-a.active em.ocheckbox{
            background: url(../images/juxing2.png) 0 0 no-repeat;
            background-size: 0.85rem;
        }
        p.title-p{
            color: #fff;
            border-bottom: 1px solid #222222;
            width: 96%;
            margin-left: 2%;
            text-align: center;
            margin-bottom: 0.5rem;
        }
    }
}
.ovf{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.table-view2 .table-view-cell:nth-of-type(1) a.table-view-cell-a{
    border-bottom: 0;
    font: 0.8rem /2.5 "";
}
.mui-popup-backdrop{
    background: rgba(0,0,0,0);
}
.mui-popup{
    background: rgba(0,0,0,.75);
    box-shadow: 0px 10px 26px 0px rgba(0, 0, 0, 0.38);
    opacity: 0.75;
    .mui-popup-title{
        padding: .8rem 0 .8rem 0;
        border-bottom: 1px solid #1a1a1a;
        font: 0.9rem /1.5 "";
        color: #fff;
        margin: 0 1rem;
    }
    .color{
        color: #d93b2a;
    }
    .addfriend{
        color: #333333;
        font: 0.9rem /2.35rem "";
        border-bottom: 1px solid #E6E6E6;
        margin-top:-2rem;
    }
    .promit-msg{
        margin-top:-0.25rem;
    }
    .promit-msg:before,.promit-msg:after{
        content: "";
        z-index: 15;
        position: absolute;
        top: 2.2rem;
        display: block;
        width: 30%;
        height: 1px;
        -webkit-transform: scaleY(0.5);
        transform: scaleY(0.5);
        -webkit-transform-origin: 50% 100%;
        transform-origin: 50% 100%;
        background-color: rgba(0, 0, 0, 0.2);
    }
    .promit-msg:before{
        left: 5%;
    }
    .promit-msg:after{
        right: 5%;
    }
    .mui-popup-text{
        margin-top: 1rem;
        margin-bottom: 0;
        font: 0.8rem/1.25rem "";
        color: #fff;
        padding: 0 2rem;
        .personal-i{
            color: #d93b2a;
        }
        .yuyue-color{
            float: left;
            display: inline-block;
            width: 45%;
            color: #ccc;
            text-align: start;
            margin-left: 5%;
            font: 0.8rem/2rem "";
        }
        .yh{
            color: #fff;
        }
    }
    .mui-popup-button{
        color: #fff;
        background-color: transparent;
    }
    .mui-popup-button:nth-of-type(1){
        border-right: 1px solid #262626;
        background-color: transparent;
    }
    .mui-popup-button ~ .mui-popup-button-bold{
         color: #fff;
    }
    .mui-popup-inner{
        padding:0 0 0.75rem 0;
        border-bottom: 1px solid #262626;
        background-color: transparent;
    }
    .mui-popup-button ~ .mui-popup-button-bold{
        border-left: 1px solid #666;
    }.mui-popup-buttons{
        border-top: 1px solid #666;
    }
}
.mui-popover{//菜单栏
    position: fixed;
    top: 16px;
    right: 6px;
    height: 11.25rem;
    background-color: #fff;
    box-shadow: 4px 2px 16px 2px rgba(0, 0, 0, 0.2);
    .mui-plus .plus{
        display: inline;
    }
    .plus{
        display: none;
    }
    #topPopover .mui-popover-arrow {
        left: auto;
        right: 6px;
    }
    p {
        text-indent: 22px;
    }
    span.mui-icon {
        font-size: 0.7rem;
        color: #007aff;
        margin-left: -15px;
        padding-right: 10px;
    }
    .mui-popover-arrow{
        top: -1.3rem;
    }
    .mui-popover-arrow:after{
        top: .9rem;
        background-color: #fff;
        box-shadow: 4px 2px 16px 2px rgba(0, 0, 0, 0.2);
    }
    .mui-content {
        padding: 10px;
    }
    .mui-scroll-wrapper{
        margin: 0.175rem 0;
        border-radius: .3rem;
    }
    .mui-table-view{
        background-color: #fff;
    }
    .mui-table-view-cell{
        padding:  0;
    }
    .mui-table-view-cell>a:not(.mui-btn){
        font-size: 0.7rem;
        color: #333;
        margin: 0;
        padding:.5rem ;
        height: 2rem;
    }    
    .mui-table-view-cell:after{
        left:0;
    }
}
.mui-backdrop{
    background-color: transparent;
}
.face-bq {
    width: 1.25rem;
    height: auto;
    vertical-align: middle;
    margin: 0 .1rem;
}
nav.nav{
    z-index: 9999;
    position: fixed;
    right: 0;
    top: 0;
    padding-top: 2.4rem;
    width: 1.8rem;
    height: 100%;
    text-align: center;
    padding-left: .6rem;
    a,.top,.bottom{
        display: block;
        width: 100%;
        height: 3.55%;
        font: 0.6rem/1.1rem "";
        color: #333;
    }
    .top{
        background: url(../images/icon_top.png) .55rem center no-repeat;
        background-size:auto 0.5rem ;
    }
    .bottom{
        background: url(../images/icon_bottom.png) .55rem center no-repeat;
        background-size:auto 0.5rem ;
    }
}

.mui-table-view-cell>a:not(.mui-btn).mui-active{
    background: transparent;
}
.gift-bqk,.gift-hyk,.gift-vip,.gift-yhk{
    display: inline-block;
    width: 1rem;
    height:  1rem;
    vertical-align: text-top;
    background: url(../images/icon_bqk.png) center no-repeat ;
    background-size: 0.88rem auto;
}
.gift-hyk{
    background-image: url(../images/icon_hyk.png);
}
.gift-vip{
    background-image: url(../images/icon_vip.png);
}
.gift-yhk{
    background-image: url(../images/icon_yhk.png);
}
.mui-search .mui-placeholder{//搜索框
    margin: .5rem 5%;
    font-size: .7rem;
    line-height: 1.5rem;
    height: auto;
}
.mui-search.mui-active:before{
    left: 6%;
}
.mui-input-row.mui-search .mui-icon-clear{
    top: 0;
    padding-top: .8rem;
    right: 5%;
}
.mui-input-row .mui-input-clear~.mui-icon-clear, .mui-input-row .mui-input-password~.mui-icon-eye, .mui-input-row .mui-input-speech~.mui-icon-speech{
    font-size: 0.75rem;
}
.mui-indexed-list-search.mui-search:before{
    margin-top: -.55rem;
}
/*******公共样式**end*/
/*******登陆*start*/
.login header.mui-bar{
    background-color: #fff;
}

.login .mui-scroll-wrapper{
    background-color: #fff;
}
.ResetGestureCode header.mui-bar{
    border-bottom: 1px solid #ccc;
}
.login,.ResetGestureCode{
    .top{
        width: 100%;
        height: 8.88rem;
        text-align: center;
        padding-top: 1.38rem;
        img{
            width: auto;
            height: 4.28rem;
        }
    }
    .main{
        padding: 0 1.88rem;
        text-align: center;
        input{
            border:0;
            background-color: initial;
            border-bottom: 1px solid #e6e6e6;
            padding-left: 2rem;
            height: 2.5rem;
            font-size: 0.7rem;
            background-repeat: no-repeat;
            background-size: 0.95rem auto;
            background-position: 0.65rem center;
            color: #333333;
        }
        .phone{
            background-image: url(../images/icon_shouji.png);
        }
        .psd{
            background-image: url(../images/icon_mima.png);
        }
        .rdntn{
            width: 12.85rem;
            margin-top: 2.5rem;
            font: 0.9rem /2rem "";
        }
        .alink{
            width: 100%;
            margin-top: .8rem;
            overflow: hidden;
            a.zc{
                float: right;
                font: 0.7rem /1.5 "";
                color: #333333;
            }
            a.wjmm{
                float: left;
                font: 0.7rem /1.5 "";
                color: #d93b2a;
            }
        }
    }
}
/*******登陆*end*/
/*******用户协议*start*/
.useragrre{
    header.mui-bar{
        border-bottom: 1px solid #ccc;
        background-color: #fff;
    }
    .mui-content{
        background-color: #fff;
    }
    .main{
        .title{
            font: 0.85rem/1.5 "";
            color: #333;   
            text-align: center;
            margin-top: 1rem;
        }
        .text{
            width: 92%;
            margin-left: 4%;
            font: 0.7rem/1.5 "";
            color: #4d4c4c;
            margin-top: 1.12rem;
        }
    }
    
}
/*******用户协议*end*/
/*******重置登陆密码**start*/
.ResetGestureCode{
    .mui-scroll-wrapper{
        background-color: #fff;
    }
    .main{
        padding-top: 1.63rem;
        .rdntn{
            width: 90%;
            margin-top: 9.73rem;
        }
        input::-webkit-input-placeholder{
            color: #ccc;
        }
        .psd{
            background-image: url(../images/icon_mima.png);
            padding-right: 5.55rem;
        }
        form{
            position: relative;
        }
        .ayzm{
            position: absolute;
            right: 0;
            bottom: 0;
            width: 5.55rem;
            color: #c30e17;
            font: 0.6rem /2.5rem "";
        }
    }
}
/*******重置登陆密码*end*/
/*******欢迎回来**start*/
.wlecome{
    text-align: center;
    .mui-scroll-wrapper{
        background-color: #ededed;
    }
    .top{
        width: 100%;
        height: 11.45rem;
        text-align: center;
        .imgbox{
            display: inline-block;
            width: 3.75rem;
            height:  3.75rem;
            overflow: hidden;
            border: solid 6px #ffffff;
            border-radius: 50%;
            margin-top: 1.98rem;
            box-shadow: 3px 6px 15px 0px rgba(0, 0, 0, 0.3)
        }
        .userimg {
            width: 100%;
            min-height: 100%;
        }
        .userimg[src='']{
            opacity: 0;
        }
        .phone{
            height: 0.75rem;
            margin-top: 1.4rem;
            font-size: 1rem;
            line-height: 0.9rem;
            color: #333333;
        }
        .phone.color{
            color: #f24130;
        }
        .loginimg{
            height: 4.28rem;
            margin-top: 1.75rem;
        }
    }
    .main{
        display: inline-block;
        width: 14.32rem;
        .hand{
            width: 100%;
            height: 14.22rem;
            div{
                width: 100%;
                display:-webkit-flex;
                display:flex;
                justify-content: space-between;
                margin-bottom: 2.05rem;
                .handa{
                    width: 3.38rem;
                    height: 3.38rem;
                    border: solid 1px #666666;
                    border-radius: 50%;
                    text-align: center;
                    p{
                        display: inline-block;
                        width: 1rem;
                        height: 1rem;
                        background-color: #666666;
                        border-radius: 50%;
                        margin-top: 1.19rem;
                    }
                }
            }
            div:last-child{
                margin-bottom:0;
            }
        }
        .alink{
            text-align: start;
            display: block;
            font-size: 0.7rem;
            line-height: 0.9rem;
            color: #999999;
            margin-top: 1.2rem;
            margin-left: 0.4rem;
        }
    }
}
/*******欢迎回来*end*/
/*******注册**start*/
.register{
    header.mui-bar{
        background-color: #fff;
    }
    .mui-content{
        background-color: #fff;
        .main{
            padding: 3.85rem 1.88rem 0 1.88rem;
            .phone,.code input,.getcode,.psd,.psd2,.sex{
                border:0;
                background-color: initial;
                border-bottom: 1px solid #e6e6e6;
                padding-left: 2rem;
                height: 2.48rem;
                font-size: 0.6rem;
                background-repeat: no-repeat;
                background-size: 0.95rem auto;
                background-position: 0.65rem center;
                color: #333;
            }
            .phone{
                background-image: url(../images/icon_shouji.png);
            }
            .code{
                position: relative;
            }
            .code input{
                padding-right: 3.5rem;
                background-image: url(../images/icon_yzm.png);
            }
            input::-webkit-input-placeholder{color: #ccc;}
            .getcode{
                position: absolute;
                top: 0;
                right: 0;
                font: 0.5rem/1rem "";
                color: #d93b2a;
                border: 1px solid #d93b2a;
                text-align: center;
                margin: .74rem 0;
                padding: 0 .5rem;
                height: 1.1rem;
                border-radius: .2rem;
            }
            .psd,.psd2{
                background-image: url(../images/icon_mima.png);
            }
            .sex{
                display: flex;
                display: -webkit-flex;
                align-items: center;
                background-image: url(../images/icon_xm.png);
            }
            .sex a{
                display: block;
                margin-right: 1.52rem;
                padding-left: 1.1rem;
                height: 100%;
                font: 0.7rem/2.47rem "";
                color: #333;
                background-image: url(../images/icon_dx.png);
                background-position:0 center; 
                background-size: 0.65rem auto ; 
                background-repeat: no-repeat;
            }
            .sex .checked{
                background-image: url(../images/icon_dx2.png);
            }
            .rdntn{
                margin-top: 2.48rem;
                width: 100%;
                height: 2rem;
                font-size: 0.9rem;
            }
        }
    }
    .useragrre{
        text-align: center;
        font: 0.6rem /1.5 "";
        .useragrre-p{
            height: 4rem;
            line-height: 4rem;
            color: #999;
        }
        .useragrre-a{
            color: #00aaff;
            line-height: 4rem;
            height: 4rem;
            display: inline-block;
        }
        .useragrre-em{
            display: inline-block;
            width: 0.65rem;
            height: 0.65rem;
            background: url(../images/fangkuang.png) 0 0 no-repeat ;
            background-size: .65rem;
            margin:.05rem .3rem .1rem .3rem;
            vertical-align:middle ;
        }
    }
    .useragrre.active .useragrre-em{
        background: url(../images/fangkuang2.png) 0 0 no-repeat;
        background-size: .65rem;
    }
}
/*******注册*end*/
/*******忘记密码**start*/
.forgetPsd{
    
    .mui-popover{
        left: auto;
        right: 0;
    }
    .mui-popover .mui-popover-arrow{
        left: auto;
        right: 1.55rem;
    }
    header.mui-bar{
        border-bottom: 1px solid #ccc;
    }
    .mui-content{
        background-color: #fff;
    }
    .main{
        padding: 2.5rem 1rem 0 1rem;
        .rdntn{
            margin-top: 2.48rem;
            width: 80%;
            margin-left: 10%;
            height: 2rem;
            font-size: 0.9rem;
        }
        .d-phone ,.code ,.d-question, .d-key{
            display: flex;
            display: -webkit-flex;
            p{
                display: block;
                font: 0.7rem /2.48rem"";
                width: 3.5rem;
                text-align: justify;
                height: 2.48rem;
                color: #333;
            }
            span{
                display: inline-block;
                width: 100%;
                height: 0;
            }
        }
        input{
            border:0;
            background-color: initial;
            border-bottom: 1px solid #e6e6e6;
            height: 2.48rem;
            font-size: 0.7rem;
            background-repeat: no-repeat;
            background-size: 0.95rem auto;
            background-position: 0.65rem center;
            color: #333;
            flex: 1;
            margin-left: 1rem;
        }
        input::-webkit-input-placeholder{
            color: #999;
        }
        .code{
            position: relative;
        }
        .getcode{
            position: absolute;
            top: 0;
            right: 0;
            font: 0.5rem/1rem "";
            color: #d93b2a;
            border: 1px solid #d93b2a;
            text-align: center;
            margin: .74rem 0;
            padding: 0 .5rem;
            height: 1.1rem;
            border-radius: .2rem;
        }
        .d-question{
            position: relative;
        }
        .question-em{
            position: absolute;
            right: 0;
            top: 0;
            display: inline-block;
            width: 2.48rem;
            height:2.48rem;
            background: url(../images/xiala.png) 1.4rem center no-repeat;
            background-size: 0.5rem auto;
        }
        .d-question.active .question-em{
            background: url(../images/shangla.png) 0 0 no-repeat;
            background-size: 100%;
        }
        .question-i{
            position: absolute;
            right: 0;
            top: 1.5rem;
            display: none;
            width: 1.25rem;
            height: 1.05rem;
            background: url(../images/muea.png) 0 0 no-repeat;
            background-size: 100%;
            z-index: 9999;
        }
        .d-question.active .question-i, .d-question.active .promit{
            display: block;
        }
        .questions{
            z-index: 999;
            display: none;
            position: absolute;
            top: 2.48rem;
            right: -1rem;
            width: 13.9rem;
            background-color: #fff;
            box-shadow: 4px -2px 16px 0px rgba(0, 0, 0, 0.1);
            p{
                width: 100%;
                text-align: center;
                border-bottom: 1px solid #ccc;
                font: 0.7rem /2.12rem "";
                color: #333;
            }
            p:last-child{
                border-bottom: 0;
            }
        }
        .d-question.active .questions{
            display: block;
        }
    }
}
/*******忘记密码*end*/
/*******个人主页*star*/
.gift-jb{
    display: inline-block;
    width: 1rem;
    height:  1rem;
    background: url(../images/icon_jb.png) center no-repeat ;
    background-size: 0.88rem auto;
    vertical-align: text-top;
}
.personal{
    .img-look.active{
        display: block;
    }
    .img-sub{
        z-index: 999;
        position: absolute;
        right: .8rem;
        bottom: 0.8rem;
        width: 2.1rem;
        height: 1.25rem;
        background-color: rgba(0, 0, 0, 0.4);
        border-radius: 0.625rem;
        text-align: center;
        color: #fff;
        font: 0.55rem/1.25rem "";
        i{
            padding: 0 .05rem;
        }
    }
    header.header{
        z-index: 999;
        position: fixed;
        top: 0.25rem;
        left: 0;
        padding: 0 0.5rem;
        width: 100%;
        overflow: hidden;
        a.back,a.collection{
            color: #fff;
            width: 2rem;
            height: 2rem;
            background-color: rgba(0, 0, 0, 0.6);
            opacity: 0.6;
            border-radius: 50%;
            text-align: center;
            line-height: 2rem;
        }
        a.collection{
            background: url(../images/icon_xx3.png) .5rem .5rem  rgba(0, 0, 0, 0.6) no-repeat;
            background-size: 1rem;
            float: right;
        }
        .active.collection{
            background-image: url(../images/icon_xx4.png);
        }
    }
    .myinfmsg p{
        width: 100%;
        height: 2.2rem;
    }
    .mui-popup .mui-popup-text{
        padding: 0;
        overflow: hidden;
    }
    .main{
        position: relative;
        border-bottom: 4.5rem solid #fff;
        .mui-slider{
            height: 20rem;
            .mui-slider-group{
                height: 100%;
            }
            .mui-slider-item a{
                height: 100%;
                width: 100%;
                overflow: hidden;
                .imgbox{
                    width: 100%;
                    left: 50%;
                    position: relative;
                    top: 50%;
                    transform: translate(-50%,-50%);
                    -webkit-transform: translate(-50%,-50%);
                }
                .imgbox.imgbox-h{
                    width: auto;
                    height: 100%;
                }
            }
            .mui-slider-indicator{
                bottom: 0.5rem;
                .mui-indicator{
                    width: 0.3rem;
                    height: 0.3rem;
                    margin: 0 0.18rem;
                }
            }
            
        }
        .content{
            border-bottom: 0.5rem solid #f5f5f5;
            background-color: #fff;
            p:last-child{
                border: 0 !important;
            }
            .nameid{
                font: .8rem/1.8 "";
                color: #333333;
                text-overflow: ellipsis;
                white-space: nowrap;
                overflow: hidden;
            }
            .name{
                font: 1rem/1.5 "";
                color: #333333;
                text-overflow: ellipsis;
                white-space: nowrap;
                overflow: hidden;
            }
            .ins{
                position: relative;
                padding: 1rem;
                .complain{
                    position: absolute;
                    right: 0;
                    top: .55rem;
                    padding: 1rem;
                    background:url(../images/icon_jubao.png) no-repeat  center;
                    background-size:  0.98rem auto;
                }
            }
            p.lable{
                margin-top: 0.35rem;
                overflow: hidden;
                i.msg-year,i.msg-vip,i.msg-renzheng{
                    float: left;
                    display: block;
                    min-width:2.4rem;
                    height: 0.85rem;
                    color: #fff;
                    font: 0.55rem/0.85rem "";
                    text-align: center;
                    margin-right: 0.5rem;
                    background-color: #d93b2a;
                    border-radius: .15rem;
                }
                i.msg-vip{
                    background-color: #e74e9d;
                }
                i.msg-renzheng{
                    background-color: #e7a44e;
                }
                em.woman,em.man{
                    display: inline-block;
                    width: 0.5rem;
                    height: 0.5rem;
                    margin-right: 0.25rem;
                    background-repeat: no-repeat;
                    background-size: 100% 100%;
                    margin-top: 0.165rem;
                }
                em.woman{
                    background-image: url(../images/icon_girl.png);
                }
                em.man{
                    background-image: url(../images/icon_boy.png);
                }
                
            }
            span.fans,span.like,span.height,span.weight{
                font: 0.7rem/1.2 "";
                display: inline-block;
                min-width: 4.5rem;
            }
            span.height,span.weight{
                margin-top: 0.425rem;
                color: #666666;
            }
            span.fans,span.like{
                margin-top: 0.4rem;
                color: #999;
            }
            p.con-title,p.con-gift{
                font: 0.7rem/1.2 "";
                color: #ff3333;
                border-bottom: 1px solid #e6e6e6;
                padding: 0.75rem;
            }
            p.con-h1,p.con-autograph,p.con-friends,p.con-voice,.con-infs,.con-biaoqian,.con-lick,.con-xingqu{
                font: 0.65rem/1.125rem "";
                border-bottom: 1px solid #e6e6e6;
                color: #333;
                margin:0 0.75rem;
                padding:0.5rem 0  ;
                overflow: hidden;
            }
            .con-video{
                position: relative;
                width: 2rem;
                height: 2rem;
                border-radius: 10px;
                overflow: hidden;
                margin: 0.95rem 0.75rem;
                .con-img{
                    width: 100%;
                    height: 100%;
                }
            }
            .con-video:after{
                z-index: 999;
                position: absolute;
                left: 0;
                top: 0;
                width: 2rem;
                height: 2rem;
                content: "";
                border-radius: 0.3rem;
                background: url(../images/videoplay.png) no-repeat center rgba(0, 0, 0, 0.5);
                background-size: 70% auto;
            }
            p.con-voice{
                background: url(../images/pstion_yuying.png) 0 .6rem  no-repeat;
                background-size: 0.45rem auto;
                min-height: 2.2rem;
            }
            p.con-infs{
                padding-left: 2rem;
                padding-right: 1.4rem;
                vertical-align: middle;
                border-bottom: 0;
            }
            p.con-infs:nth-of-type(2){
                background: url(../images/gr_1.png) 0 center no-repeat;
                background-size: 0.875rem auto;
            }
            p.con-infs:nth-of-type(3){
                background: url(../images/gr_2.png) 0 center  no-repeat;
                background-size: 0.875rem auto;
            }
            p.con-infs:nth-of-type(4){
                background: url(../images/gr_3.png) 0 center  no-repeat;
                background-size: 0.875rem auto;
            }
            p.con-infs:nth-of-type(5){
                background: url(../images/gr_4.png) 0 center  no-repeat;
                background-size: 0.875rem auto;
            }
            p.con-infs:nth-of-type(6){
                background: url(../images/gr_5.png) 0 center  no-repeat;
                background-size: 0.875rem auto;
            }
            p.con-h1{
                display: -webkit-flex;
                .con-h1-msg{
                    display: inline-block;
                    height: 100%;
                    width: 100%;
                }
            }
            .con-voice-img{
                width: 3.35rem;
                height: auto;
                vertical-align: middle;
                margin:0 .5rem 0 1.1rem ;
            }
            .voice-time{
                font: 0.75rem /1.05rem "";
                color: #666;
                vertical-align: middle;
            }
            .con-autograph{
                border: 0;
                font: 0.65rem/1.125rem "";
                color: #000;
                margin: 0 0.75rem;
                padding-left: 1.525rem;
                background: url(../images/icon_qm.png) 0 center no-repeat ;
                background-size: 0.75rem auto;
            }
            p.con-friends img{
                width: 2rem;
                height: 2rem;
                float: right;
                border-radius: 0.15rem;
                margin-left: 0.5rem;
            }
            .friends-font{
                padding-left: 1.55rem;
                background: url(../images/icon_pyq.png) 0 center no-repeat ;
                background-size: 0.775rem auto;
                font: 0.65rem/2rem "";
                float: left;
            }
            p.con-gift{
                position: relative;
            }
            a.con-gift-a{
                position: absolute;
                right: 0;
                top: 0;
                font-size: 1.35rem;
                padding: 0.39rem 0.75rem;
                color: #999;
            }
            p.con-gift-p{
                display: none;
                padding-top: 0.25rem;
                .con-h1-left{
                    display: block;
                    width: 100%;
                    color: #333;
                    font: 0.7rem/2 "";
                    padding-right: 0.7rem;
                    margin-top: 0.2rem;
                }
                .giftimg-div{
                    display: flex;
                    display: -webkit-flex;
                    justify-content: center;
                    align-items: center;
                    font: 0.55rem/1.2 "";
                    width: 100%;
                    color: #333;
                    height: 2rem;
                    margin-bottom: .5rem;
                }
                .gift{
                    display: inline-block;
                    width: 24%;
                    height: 2.975rem;
                    text-align: center;
                    border-radius: 0.38rem;
                    line-height: 0;
                    margin-top: 0.5rem;
                    .giftimg{
                        max-height: 2rem;
                        max-width: 50%;
                        vertical-align: middle;
                    }
                    em{
                        width: 100%;
                        color: #666;
                        font: 0.5rem / 1.5 "";
                    }
                    span.text{
                        display: block;
                       font:0.55rem/ 1.5 ""; 
                       width: 100%;
                       color: #333;
                    }
                }
            }
            p.con-biaoqian,p.con-lick,.con-xingqu{
                padding-left: 1.525rem;
                background: url(../images/biaoqian.png) 0 .8rem no-repeat ;
                background-size: 0.85rem auto;
                border-bottom: 0;
                a{
                    display: inline-block;
                    background: rgba(255,133,188,0.6);
                    color: #fff;
                    font: 0.55rem /1.05rem "";
                    padding: 0.1rem 0.6rem 0.2rem 0.6rem;
                    margin-right: 0.25rem;
                    margin-bottom: .25rem;
                    border-radius: 0.2rem;
                }
            }
            p.con-lick{
                background: transparent;
                a{
                   background: rgba(19,100,13,0.6); 
                }
            }
            .con-xingqu,.con-biaoqian{
                min-height: 2.2rem;
            }
            p.con-lick:nth-of-type(2){
                background: url(../images/xingqu.png) 0 .8rem no-repeat ;
                background-size: 0.85rem auto;
                margin-bottom: -.5rem;
                padding-top: .65rem;
            }
            p.con-xingqu-run{
                background: url(../images/paobu.png) 0 .8rem no-repeat ;
                background-size: 0.85rem auto;
                a{
                    background: rgba(134,95,243,0.6);
                }
            }
            p.con-xingqu-music{
                background: url(../images/yingyue.png) 0 .8rem no-repeat ;
                background-size: 0.85rem auto;
                a{
                    background: rgba(237,92,92,0.6);
                }
            }
            p.con-xingqu-foot{
                background: url(../images/foot.png) 0 .8rem no-repeat ;
                background-size: 0.85rem auto;
                a{
                    background: #d5c32c;
                }
            }
            p.con-xingqu-dianying{
                background: url(../images/dianying.png) 0 .8rem no-repeat ;
                background-size: 0.85rem auto;
                a{
                    background: #2e337a;
                }
            }
            p.con-xingqu-lvxing{
                background: url(../images/lvxing.png) 0 .8rem  no-repeat ;
                background-size: 0.85rem auto;
                a{
                    background: #3c73ef;
                }
            }
            p.con-xingqu-book{
                background: url(../images/shu.png) 0 .8rem no-repeat ;
                background-size: 0.85rem auto;
                a{
                    background: #ef813e;
                }
            }
        }
        .contentlast{
            border-bottom: 0;
        }
    }
    footer.footer{
        z-index: 999;
        position: fixed;
        bottom: .5rem;
        left: 0;
        width: 100%;
        padding: 0 0.73rem;
        overflow: hidden;
        a.footer-addfriend,a.footer-love{
            display: block;
            width: 4rem;
            height: 4rem;
            background-repeat: no-repeat;
            background-position: center;
        }
        a.footer-addfriend{
            float: left;
            background-size:3.45rem 3.15rem;
            background-image: url(../images/icon_addfriend0.png);
        }
        .footer-addfriend.active{
            background-image: url(../images/icon_addfriend.png);
        }
        a.footer-love{
            float: right;
            background-size: 3.45rem 3.3rem;
            background-image: url(../images/icon_love0.png);
        }
        .footer-love.active{
            background-image: url(../images/icon_love.png);
        }
    }
}
/*******个人主页**end*/
/*******投诉*star*/
.complaint{
    header.mui-bar {
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .mui-scroll-wrapper{
        background-color: #fff;
    }
    .complaint-text{
        margin:0 5%;
        width: 90%;
        min-height: 9.6rem;
        padding: 0.75rem;
        border: 0;
        font-size: 0.7rem;
        background-color: #F5F5F5;
        -moz-user-select: text; 
        -webkit-user-select: text;
        .face-bq{
            max-width: 1.25rem;
            max-height: 1.5rem;
            margin: 0 .1rem;
            vertical-align:middle;
        }
        div{
            float: left;
        }
    }
    .title{
        padding:.6rem 5%  .6rem 5%;
        font: 0.75rem /1.5 "";
        color: #333;
    }
    .complaint-text.active:before{
        color: #999;
        float: left;
        content: "这一刻的想法...";
    }
    .complaint-img-box{
        padding:0 5% 0 5%;
        line-height: 0;
        li{
            position: relative;
            display: inline-block;
            width: 3.69rem;
            height: 3.69rem;
            margin-right: 0.7rem;
            margin-bottom: 0.7rem;
            .complaint-add video{
                width: 100%;
                height: 100%;
            }
            .complaint-img{
                position: relative;
                display: inline-block;
                width: 100%;
                height: 100%;
                border-radius: .3rem;
                overflow: hidden;
                img,video{
                    position: absolute;
                    top: 50%;
                    left: 0;
                    width: 100%;
                    -webkit-transform: translate(0 ,-50%);
                    transform: translate(0 ,-50%);
                }
            }
            .complaint-add{
                display: inline-block;
                width: 100%;
                height: 100%;
                border-radius: .3rem;
                background: url(../images/icon_jia01.png) no-repeat center #F5F5F5;
                background-size: 1.4rem auto;
            }
            i.close{
                position: absolute;
                top: -0.8rem;
                right: -0.8rem;
                padding: 0.95rem;
                background: url(../images/icon_sc.png) center no-repeat;
                background-size: 0.95rem auto;
            }
        }
        li:nth-of-type(4n){
            margin: 0;
        }
    }
    .shu{
        text-align: end;
        margin-right: 5%;
        font: 0.7rem /1.2 "";
    }
    .but{
    text-align: center;
    padding: 3.925rem 0 2.5rem 0;
        .rdntn{
            width: 13rem;
            height: 2rem;
        }
    }
}
/*******投诉**end*/
/*******预约认证*star*/
.orderapprove{
    .mui-scroll-wrapper{
        background-color: #fff;
    }
    .complaint-h1{
        display: -webkit-flex;
        justify-content: space-between;
        border-bottom: 1px solid #E6E6E6;
        padding: 0 0.75rem;
        .complaint-title{
            font:0.7rem/2.1rem "";
            color: #333;
            
        }
        input{
            font:0.7rem/2.1rem "";
            border: 0;
            width: 50%;
            text-align: end;
        }
        input::-webkit-input-placeholder{color: #999;}
    }
    .complaint-img-title{
        font:0.7rem/2.1rem "";
        color: #333;
        padding: 0 0.75rem;
    }
    .but{
        padding: 2.5rem 0 2.5rem 0;
        text-align: center;
        .rdntn {
            width: 15rem;
            height: 2rem;
        }
    }
    .complaint-img-box {
        width: 100%;
        padding-left: 0.7rem;
        line-height: 0;
        padding-bottom: 0.3rem;
        border-bottom: 1px solid #e6e6e6;
        .complaint-img {
            display: inline-block;
            width: 100%;
            height: 100%;
            overflow: hidden;
            text-align: center;
        }
        li {
            position: relative;
            display: inline-block;
            width: 5.25rem;
            height: 5.25rem;
            margin-right: 0.7rem;
            margin-bottom: 0.7rem;
            i.close{
                position: absolute;
                top: -0.8rem;   
                right: -0.8rem;
                padding: 0.95rem;
                background: url(../images/icon_sc.png) center no-repeat;
                background-size: 0.625rem auto;
            }
            img{
                width: 100%;
                height: 100%;
            }
            .complaint-shu{
                position: absolute;
                bottom: 1.35rem;
                left: 0;
                display: block;
                width: 100%;
                font-size: 0.7rem;
                color: #ccc;
            }
        }
    }
}
/*******预约认证**end*/
/*******朋友圈*star*/
.circlefriends{
    .pls-img-look .mui-slider-item a{
        text-align: center;
    }
    #video{ 
        max-width: 100%;
        max-height: 100%;
    }
    position: relative;
    .mui-scroll-wrapper{
        background-color: #fff;
    }
    .newmsg{
        display: none;
        width: 100%;
        height: 4.75rem;
        border-bottom: 1px solid #E6E6E6;
        padding-top: 2rem;
        .newmsg-box{
            display: block;
            margin:0 auto;
            width: 9rem;
            height: 2.3rem;
            background-color: #383939;
            border-radius: .3rem;
        }
        .newmsg-img{
            float: left;
            margin: 0.25rem;
            width: 1.8rem;
            height: 1.8rem;
            border-radius: 0.2rem;
        }
        .newmsg-span{
            float: left;
            width: 5rem;
            text-align: center;
            color: #fff;
            font: 0.7rem /2.3rem "";
        }
        .new-i{
            float: right;
            width: 1.5rem;
            height: 100%;
            background: url(../images/newmsg_left.png) center no-repeat ;
            background-size: 0.35rem 0.55rem;
        }
    }
    .title-header{
        position: relative;
        width: 100%;
        height: 12.8rem;
        overflow: hidden;
        .title-bg{
            background-repeat: no-repeat;
            background-position: 0 center;
            background-size: 100% auto;
            width: 100%;
            height: 100%;
        }
        .user-inf{
            position: absolute;
            left: 0;
            bottom: 0;
            padding: .75rem;
            display: flex;
            display: -webkit-flex;
            align-items: center;
        }
        .my-name{
            color: #fff;
            font: 0.8rem;
            margin-left: .75rem;
        }
    }
    .user-img-box,.my-img-box{
        width: 2.25rem;
        height: 2.25rem;
        border-radius: 50%;
        border: 1px solid #fff;
        overflow: hidden;
    }
    .user-img-box{
        margin: .77rem;
    }
    .my-img,.user-img{
        width: 100%;
        min-height: 100%;
    }
    .user-img[src=''],.my-img[src='']{
        opacity: 0;
    }
    .title-header .my-img{
        margin: 0;
    }
    .main{
        .list{
            position: relative;
            display: flex;
            display: -webkit-flex;
            .list-text{
                flex: 1;
                line-height: 0;
                .user-name{
                    width: 8rem;
                    height: 2rem;
                    text-overflow: ellipsis;
                    overflow: hidden;
                    white-space: nowrap;
                    font: 0.8rem /1.25rem "";
                    color: #333;
                    padding-top: 0.77rem;
                }
                .user-text-box,.user-text{
                    font: 0.7rem/1.5 "";
                    color: #666;
                    padding-right: 2.875rem;
                    margin-top: .2rem;
                    margin-bottom: 0.4rem;
                }
                .user-text{
                    width: 100%;
                    overflow: hidden;
                    text-overflow: clip;
                    display: -webkit-inline-box;
//                  -webkit-line-clamp:3;
                    -webkit-box-orient: vertical;
                }
                .user-img-big{
                    width: 100%;
                    overflow: hidden;
                    img{
                        max-width: 100%;
//                      max-height: 12.25rem;
                    }
                }
                .vdio-imgbox{
                    width: 7rem;
                    position: relative;
                    text-align: center;
                    img{
//                      width: 12.25rem;
//                      height: 7rem;
//                      max-width: initial;
//                      margin-top: 2.6rem;
//                      margin-left: -2.6rem;
//                      transform:rotate(90deg);
                    }
                }
                .user-img-big-adm{
                    width: 12.5rem;
                    height: 7rem;
                    overflow: hidden;
                    text-align: center;
                    img{
                        height: 100%;
                    }
                }
                .user-img-smo{
                    display: inline-block;
                    width: 100%;
                    overflow: hidden;
                    img,video{
                        float: left;
                        width: 3.95rem;
                        height: 3.95rem;
                        border-radius: 0.3rem;
                        margin-right: 0.25rem;
                        margin-bottom: 0.25rem;
                    }
                }
                .user-link{
                    padding-top: 1rem;
                    display: flex;
                    display: -webkit-flex;
                    position: relative;
                }
                .user-link-a{
                    display: inline-block;
                    margin-right: 0.5rem;
                    width: 5rem;
                    height: 1.75rem;
                    background-color: #f5f5f5;
                    text-align: center;
                    border-radius: 0.3rem;
                }
                .comment,.like{
                    padding-left: 1.125rem;
                    line-height:1.75rem;
                    color: #999;
                    font-size:0.7rem;
                    background-image: url(../images/icon_pl01.png);
                    background-size: 0.75rem auto;
                    background-position:  0 center;
                    background-repeat: no-repeat;
                }
                .like{
                    background-image: url(../images/icon_aixin0.png) ;
                }
                .user-link-a-onlike .like{
                    background-image: url(../images/icon_aixin1.png);
                }
                .user-link-menu{
                    position: absolute;
                    right: 0.45rem;
                    top:  1rem;
                    padding: 0.925rem;
                    background: url(../images/icon_caidan.png) center no-repeat;
                    background-size: auto 0.925rem; 
                }
                .showall{
                    display: block;
                    font: 0.7rem /1.2 "";
                    color: #d93b2a;
                    padding-bottom: 0.4rem;
                }
            }
            .adm-box{
                position: absolute;
                top: .7rem;
                right: 0.77rem;
            }
            .time{
                float: right;
                display: block;
                font-size: 0.6rem;
                line-height: 1.1rem;
                color: #999;
                padding-left: .5rem;
            }
            .adm{
                float: right;
                display: block;
                font-size: 0.6rem;
                width: 2.5rem;
                line-height: 1.5;
                height: 1.15rem;
                border: 1px solid #999;
                color: #999;
                border-radius: .1rem;
                text-align: center;
                .adm-em{
                    display: inline-block;
                    width: 0.38rem ;
                    height: 0.25rem;
                    background: url(../images/admxiala.png) 0 0 no-repeat;
                    background-size: 100%;
                    margin-left: .2rem;
                }
            }
        }
        .like-box{
            position: relative;
            margin-top: 1.5rem;
            overflow: hidden;
            background: url(../images/icon_aixin1.png) 1.5rem 0.7rem #e6e6e6 no-repeat;
            background-size: 0.75rem auto;
            padding: 0 3rem 0 3.5rem;
            line-height: 0;
            height: 2rem;
            min-height: 2rem;
            .mui-icon{
                position: absolute;
                right: 0;
                top: 0;
                font-size: 1.35rem;
                padding: 0.3rem 0.75rem;
                color: #999;
            }
        }
        .like-img{
            float: left;
            overflow: hidden;
            text-align: center;
            margin: .25rem .25rem;
            border-radius: 50%;
            width: 1.5rem;
            height: 1.5rem;
            img{
                width: 100%;
                min-height: 100%;
            }
        }
        .like-talking{
            display: none;
            background-color: #e6e6e6 ;
            .like-talk{
                overflow: hidden;
                .like-img{
                    float: left;
                    margin: 0.45rem 1rem;
                }
                .talkname{
                    color: #333;
                }
                .talkname .color{
                    color: #ff3333;
                }
                .talktext{
                    float: left;
                    word-wrap: break-word;
                    width: 14.5rem;
                    padding: 0.7rem 0.8rem 0.7rem 0;
                    font: 0.7rem/1.5 "";
                    color: #666;
                    border-top: 1px solid #ccc ;
                    .talktext-bq{
                        width: 0.925rem;
                        height: auto;
                        vertical-align: middle;
                    }
                    .face-bq{
                        width: 1.25rem;
                        height: auto;
                        min-height: 1.25rem;
                        vertical-align: middle;
                        margin: 0 .1rem;
                    }
                    .face-img{
                        width: 2rem;
                        height: auto;
                        vertical-align: middle;
                    }
                }
            }
            .like-talk:first-child{
                border-top: 1px solid #ccc ;
                .talktext{
                    border-top:0;
                }
                .talkname{
                    border-top:0;
                }
            }
        }
    }
    .user-text .face-bq{
        width: 1.25rem;
        height: auto;
        vertical-align: middle;
        margin: 0 .1rem;
    }
    .user-img-big{
        position: relative; 
        .user-img-video{
            background-size: 2.5rem auto!important;
        }
    }
    .footer{
        display: none;
        position: absolute;
        left: 0;
        bottom: 0;
        height: 2.25rem;
        transition: opacity 300ms linear;
        -webkit-transition: opacity 300ms linear;
    }
    .dialogue{
        z-index: 99999;
        position: fixed;
        bottom: 0;
        left: 0;
        display:none;
        width: 100%;
        height:auto;
        background-color: #f8f8f8;
        .foot-link-box{
            display: flex;
            display: -webkit-flex;
            align-items: flex-end;
        }
        .dialogue-input{
            font-size: 0.7rem;
            background: inherit;
        }
        .chat-val-box{
            width:12.7rem;
            border: 0;
            margin: .5rem .52rem;
        }
        .dialogue-input.dialogues:before{
            color: #ccc;
            content:attr(data-content);
        } 
        .face{
            float: left;
            margin: .5rem 0;
            display: inline-block;
            width: 1.5rem;
            height: 1.5rem;
            background: url(../images/icon_sml.png) no-repeat 0 0 ;
            background-size: contain ;
        }
        .dialogue-btn{
            float: left;
            display: inline-block;
            margin: .5rem 0 .5rem  0.6rem;
            width: 2.225rem;
            color: #fff;
            font: 0.6rem /1.5rem "";
            text-align: center;
            background-color: #d93b2a;
            border-radius: 0.3rem;
        }
    }
}
.circlefriends header.header-color .camera,.circlefriendsimg header.header-color .header-menu,.myfriends header.header-color .header-menu{
    z-index: 9999;
    padding: 1.1rem;
    margin-right: -0.2rem;
    background: url(../images/icon_zxj0.png) no-repeat center ;
    background-size: 0.95rem auto;
}
/*******朋友圈**end*/
/*******发朋友圈*star*/
.friendpicture{
    .circlefriends{
        overflow: hidden;
    }
    .main{
        margin-bottom: 2rem;
    }
    .complaint-text{
        background-color: transparent;
        margin: 0;
        width: 100%;
        min-height: 11.5rem;
        padding: 0.75rem;
        border: 0;
        font-size: 0.8rem;
        -moz-user-select: text;
        -webkit-user-select: text;
        overflow-y: scroll;
    }
    .complaint-img-box li .complaint-add{
        background:transparent;
        img{
            width: 100%;
            height: 100%;
        }
    }
    .complaint-img-box{
        border: 0;
        display: none;
        margin-top: 1rem;
        li i.close{
            background: url(../images/icon_sc2.png) center no-repeat;
            background-size: 0.95rem auto;
            z-index: 9999;
        }
    }
    .see{
        margin-left: 0.75rem;
        padding: 0.2rem 0.5rem 0.2rem 0.5rem;
        font: 0.6rem /1.5 "";
        border-radius: 0.8rem;
        background-color: #cecece;
        color: #fff;
    }
    .active.see{
        background-color: #d93b2a;
    }
    .complaint-btn{
        position: absolute;
        right: 0;
        top: 0;
        color: #fff;
        font: 0.75rem /2.2rem"";
        padding: 0 0.5rem;
    }
    .dialogue {
        display: block;
    }
    .dialogue .face{
        margin: .5rem 0.75rem;
    }
    video.add{
        width: auto!important;
        height: auto!important;
    }
}
.friendpicture  .complaint-img-video,.circlefriends .user-img-big .user-img-video{
    z-index: 999;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(../images/videoplay.png) no-repeat center rgba(0, 0, 0, 0.5);
    background-size: 1.5rem auto;
}

/*******发朋友圈**end*/
/*******朋友圈图片预览*star*/
.myfriends  header.header-color .header-menu{
    background: url(../images/icon_caidan.png) no-repeat center ;
    background-size:  auto 0.9rem;
}
.circlefriendsimg header.header-color .header-menu{
    background: url(../images/icon_caidan1.png) no-repeat center ;
    background-size:  auto 0.9rem;
}
.circlefriendsimg .menu-click,.myfriends  .menu-click{
    z-index: 99999;
    display: none;
    position: fixed;
    right: 0.5rem;
    top: 0.3rem;
    min-width: 9.6rem;
    background-color: #fff;
    border-radius: 0.3rem;
    .menu-click-text{
        font: 0.9rem/2.075rem "";
        color: #333;
        padding: 0 0.75rem;
    }
}
.circlefriendsimg{
    display: none;
    z-index: 99;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    .mui-scroll-wrapper{
        background-color: #000;
    }
    header.header-color{
        display: none;
        background-color: rgba(0,0,0,.6);
    }
    header.mui-bar .mui-icon,header.mui-bar .mui-title{
        color: #fff;
    }
    .mui-bar-nav ~ .mui-content,.mui-bar-nav ~ .mui-content > .mui-scroll-wrapper{
        padding: 0;
    }
    .mui-slider{
        height: 100vh !important;
        background-color: #000 !important;
        display: block!important;
        .mui-slider-group{
            height: 100%;
            a{
               width: 100vw;
               height: 100%;
               position: relative;
            }
            img,video{
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%,-50%);
                -webkit-transform: translate(-50%,-50%);
                max-height: 100%;
                max-width: 100%;
            }
        }
    }
    footer.friendsimg-footer{
        z-index: 9999;
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        padding: 0.75rem 0.9rem;
        .footer-text{
            font: 0.7rem/1.5 "";
            color: #fff;
        }
        .btn-like,.btn-talk{
            width: 5rem;
            background-color: #242424;
            border-radius: 0.3rem;
            text-align: center;
        }
        .btn-i{
            display: inline-block;
            float: right;
        }
        .talk,.like,.i-talk,.i-like{
            padding-left: 1.125rem;
            font: 0.7rem /1.75rem "";
            color: #999;
            background-position: 0 center ;
            background-repeat: no-repeat;
            background-size: 0.75rem auto;
        }
        .talk{
            background-image: url(../images/icon_pl01.png);
        }
        .i-talk{
            color: #fff;
            background-position:0.2rem center ;
            background-image: url(../images/icon_pl.png);
        }
        .like{
            background-image: url(../images/icon_dz3.png);
        }
        .onlike .like{
            background-image: url(../images/icon_dz1.png);
        }
        .i-like{
            color: #fff;
            background-position:0.25rem center ;
            background-image: url(../images/icon_dz0.png);
        }
        .ft-bottom{
            display: none;
            overflow: hidden;
        }
    }
}
.popover-img,.myfriends .popover{
    background: 0;
}
/*******朋友圈图片预览**end*/
/*******我的朋友圈*star*/
.myfriends{
    .main{
        padding:  0.55rem 0;
        .inf{
            display: flex;
            display: -webkit-flex;
            padding:  0.55rem 1.175rem;
            .inf-time{
                margin-right: 0.8rem;
                padding-top: 0.375rem;
                width:1.55rem;
                text-align: center;
                p.inf-time-text{
                    color: #333;
                    font:600 0.8rem /1.5 "";
                }
                span.inf-time-text{
                    color: #666;
                    font: 0.7rem/1.2 "";
                }
            }
            .inf-msg{
                flex: 1;
                -webkit-flex: 1;
                position: relative;
                display:flex;
                display: -webkit-flex;
                .inf-img{
                    width: 4.75rem;
                    height: 4.75rem;
                    overflow: hidden;
                }
                .inf-video:before{
                    z-index: 999;
                    position: absolute;
                    left: 0;
                    top: 0;
                    width: 4.75rem;
                    height: 4.75rem;
                    content:"";
                    border-radius: 0.3rem;
                    background: url(../images/videoplay.png) no-repeat center rgba(0, 0, 0, 0.5);
                    background-size: 2rem auto;
                }
                .img-first img,.img-second img,.img-thirdly img,.img-last img{
                    margin-top:0.2rem;
                    margin-left: 0.2rem;
                    float: left;
                    width: 2.1rem;
                    height: 2.1rem;
                    border-radius: 0.3rem;
                }
                .img-second img:first-child,.img-thirdly img{
                    height: 4.4rem;
                }
                .img-last img{
                    width: 100%;
                    height: 100%;
                    margin: 0;
                }
                .img-null{
                    display: none;
                }
                .inf-text{
                    flex: 1;
                    -webkit-flex: 1;
                    position: relative;
                    padding-left: 0.6rem;
                    font: 0.7rem /1.25rem "";
                    .inf-text-p{
                        text-overflow: clip;
                        display: -webkit-inline-box;
                        -webkit-line-clamp:3;
                        -webkit-box-orient: vertical;
                        overflow: hidden;
                        color: #666;
                    }
                    p.pages{
                        position: absolute;
                        bottom: 0;
                        left: 0.6rem;
                        color: #999;
                    }
                }
                .inf-text-p-null{
                    padding: .5rem 0.75rem 0.75rem 0.75rem;
                    border-radius: 0.3rem;
                    background-color: #F5F5F5;
                }
            }
        }
    }
}
/*******我的朋友圈**end*/
/*******详情*star*/
.particulars{
     .main .like-talking{
        display: block;
        .face-bq{
            width: 1.25rem;
            height: auto;
            vertical-align: middle;
        }
    }
    header.mui-bar {
        border-bottom: 1px solid #ccc;
    }  
    .chat-val.dialogues{
        color: #ccc!important;
    }
        
}
.pls-img-look{
    display: none;
    z-index: 99999;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: #000!important;
    .mui-slider-group{
        height: 100%;
    }
    .mui-slider-item{
        height: 100%;
        background-color: #000;
        a{
            position: absolute;
            display: block;
            max-width: 100%;
            max-height: 100%;
            top: 50%;
            left: 50%;
            transform: translate(-50%,-50%);
            -webkit-transform: translate(-50%,-50%);
        }
    }
    .mui-slider-indicator{
        bottom:1.5rem;
    }
}
.particulars .circlefriendsimg header.mui-bar{
    border-bottom: 0;
}

/*******详情**end*/
/*******会员中心**start*/
.membercenter{
    header.mui-bar {
        border-bottom: 1px solid #ccc;
    }
    position: relative;
    .mui-content{
        background: #fff;
        .content-title{
            box-sizing: border-box;
            padding: 0 0.75rem;
            border-bottom: solid 0.5rem #f5f5f5;
            display: flex;
            display: -webkit-flex;
            align-items: center;
            width: 100%;
            height: 4.5rem;
            background: #fff;
            img{
                width: 3.3rem;
                height: 3.3rem;
                border-radius: 50%;
            }
            img[src='']{
                opacity: 0;
            }
            .ovmoney{
                margin-top: .1rem;
                color: #666;
                font-size: 0.7rem;
                .color{
                    color:#d93b2a;
                }
            }
            .title-right{
                padding-left: 0.6rem;
            }
            .title-right h3{
                font-size: 0.9rem;
                color: #333;
            }
            .title-right p{
                margin-top: .1rem;
                font-size: 0.7rem;
                color: #666;
            }
            .title-right p span{
                padding: 0 0.25rem;
                color: #d93b2a;
            }
        }
        .main{
            border-bottom: solid 0.5rem #F5F5F5;
            background: #fff;
            h2{
                box-sizing: border-box;
                padding: 0.75rem 0.75rem 1rem 0.75rem;
                font-size: 0.75rem;
                color: #333;
            }
            .main-ul{
                box-sizing: border-box;
                padding: 0 .5rem 0.75rem .8rem;
                li:last-child{
                    margin-bottom: 0;
                }
                li{
                    display: flex;
                    display: -webkit-flex;
                    align-items: center;
                    justify-content: space-between;
                    box-sizing: border-box;
                    padding: 0 0.75rem;
                    margin-bottom: 0.5rem;
                    width: 100%;
                    height: 2.87rem;
                    border: solid 1px #e6e6e6;
                    border-radius: 0.5rem;
                }
                .main-left h3{
                    font-size: 0.75rem;
                    color: #333;
                }
                .main-left p{
                    font-size: 0.6rem;
                    color: #999;
                    padding-top: .2rem;
                }
                .main-right span,.main-right{
                    font-size: 0.8rem;
                    color: #b56a24;
                }
                .main-right em.money{
                    display: inline-block;
                    width: 1.2rem;
                    height:  1.2rem;
                    background: url(../images/icon_jb.png) center no-repeat ;
                    background-size: 1.17rem auto;
                    vertical-align: middle;
                }
                .pitch{
                    background-color: rgba(0, 0, 0, 0.31);
                    box-shadow: 0px 10px 26px 0px rgba(0, 0, 0, 0.16);
                }
            }
        }
        .msg{
            margin: .5rem .8rem 3rem .8rem;
        }
        .msg .title{
            font: 0.8rem /2 "";
            color:#333;
        }
        .msg .text{
            font: 0.7rem /1.5 "";
            color:#666;
        }
    }
    footer{
        z-index: 9;
        display: flex;
        display: -webkit-flex;
        align-items: center;
        justify-content: space-between;
        position: absolute;
        bottom: 0;
        left: 0;
        box-sizing: border-box;
        width: 100%;
        height: 2.25rem;
        background: #fff;
        border-top: solid 0.03rem #e6e6e6;
        .price{
            flex: 1;
            -webkit-flex: 1;
            text-align: center;
            font-size: 0.9rem;
        }
        .price span,em.em-color{
            color: #d93b2a;
        }
        button.btn{
            width: 7.5rem;
            height: 100%;
            font-size: 0.9rem;
            color: #fff;
            background:#d93b2a;
            border-radius: 0;
        }
    }
}
/*******会员中心**end*/

/*******我的账户**start*/
.notecase {
    header.mui-bar {
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    em.money{
        display: inline-block;
        width: 2.5rem;
        height:  2.5rem;
        background: url(../images/icon_jb.png) center .4rem no-repeat ; 
        background-size: 2rem auto;
        vertical-align: text-bottom;
    }
    .mui-content .mui-scroll-wrapper {
        padding-top: 17rem;
        background-color: #fff;
    }
    .notecase-balance {
        width: 100%;
        height: 10.6rem;
        background-color: #fff;
        color: #d93b2a;
        padding-top: 1rem;
        position: relative;
        z-index: 8;
        .balance-title {
            text-align: center;
            font-size: 0.7rem;
            line-height: 0.7rem;
            color: #333;
        }
        .balance-num {
            height: 4.55rem;
            margin: 0.5rem 1rem 0 1rem;
            overflow: hidden;
            background: url(../images/balance-num-bg.png) center center no-repeat;
            background-size: contain;
            text-align: center;
            .balance {
                font-size: 2.5rem;
                margin-top: .7rem;
                display: inline-block;
            }
        }
        .btns-recharge-withdraw {
            margin-top: 0.75rem;
            border-top: 1px solid #F5F5F5;
            overflow: hidden;
            padding: 0.6rem 0;
            text-align: center;
            a {
                color: #333;
                font-size: 0.8rem;
                padding: 0.4rem 0;
            }
        }
    }
    .notecase-msg {
        width: 100%;
        position: relative;
        z-index: 10;
        background-color: #F5F5F5;
        border-top: solid 0.5rem #f5f5f5;
        .msg-title {
            font-size: 0.8rem;
            color: #333;
            padding: .5rem .75rem;
            background-color: #fff;
        }
    }
    .notecase-msg-title {
        width: 100%;
        height: 1.25rem;
        position: relative;
        z-index: 10;
    }
    .notecase-msg-list {
        width: 100%;
        background-color: #fff;
        th {
            height: 1.25rem;
            line-height: 1.25rem;
            background-color: #f4f4f4;
            font-size: 0.6rem;
            color: #999;
        }
        td {
            font-size: 0.7rem;
            padding: 0.75rem 0;
            color: #666;
        }
        .msg-item {
            border-bottom: 1px solid #F4F4F4;
            .item-middle {
                font-size: 0.6rem;
            }
        }
        .msg-item:last-child{
            border-bottom: 0;
        }
        .item-left {
            text-align: left;
            padding-left: 1.25rem;
            width: 40%;
        }
        .item-middle {
            text-align: center;
            width: 30%;
        }
        .item-right {
            text-align: right;
            padding-right: 1.25rem;
            width: 30%;
        }
        .red {
            color: #f33;
        }
        .blue {
            color: #0cc;
        }
    }
}
/*******我的账户**end*/

/*******提现**start*/
.withdraw{
    .cent{
        text-align: center;
    }
    .mui-popup .mui-popup-text{
        text-align: start;
        margin-left: 10%;
        margin: .6rem 10%;
        line-height: 2;
        font-size: 0.8rem;
    }
    header.header-color {
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .withdraw-content {
        margin-bottom: 0.5rem;
        padding: 0.75rem 0 0 0;
        background-color: #fff;
    }
    .withdraw-title {
        padding: 0 1.5rem;
        font-size: 0.8rem;
        line-height: 0.7rem;
        color: #666;
    }
    .withdraw-money {
        padding: 0 1.5rem 0 1.5rem;
        margin-top: 0.65rem;
        font-size: 1.2rem;
        color: #333;
        line-height: 1;
        border-bottom: 1px solid #e5e5e5;
        span{
            float: left;
            margin-top: 0.35rem;
        }
        .money {
            display: inline-block;
            margin-left: 0.7rem;
            width: 90%;
            font-size:0.6rem;
            color: #333;
            border: none;
            line-height: 2rem;
            margin-bottom: 1px;
        }
        .money::-webkit-input-placeholder{color: #ccc;}
    }
    .table-view1{
        .table-view-cell-input{
            background: transparent;
            color: #fff;
            border: 0;
            margin-top: 1rem;
            padding: 0 .5rem;
        }
        .table-view-cell-input::-webkit-input-placeholder{
            color: #E6E6E6;
        }
    }
    .withdraw-msg {
        padding: 0.4rem 1.5rem 0.6rem 1.5rem;
        font-size: 0.6rem;
        color: #666;
    }
    .clue{
        color: #999;
    }
    .payment{
        background: #fff;
        h3,h2{
            padding: 0 0.75rem;
            font: 0.75rem/2.22rem "";
            color: #333;
            border-bottom: solid 2px #f2f2f2;
        }
        h2{
            color: #666;
            em{
                float: right;
                font: 0.7rem /2.22rem"";
            }
        }
        a{
            display: block;
            padding-bottom: 0.75rem;
        }
        .name,.cardid{
            float: right;
            border: 0;
            text-align: end;
            padding: 1.1rem 0;
            background: transparent;
        }
        .wechat-box{
            border-bottom: solid 1px #e5e5e5;
        }
        .alipay,.wechat{
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: space-between;
            padding: 0.65rem 1.45rem 0.65rem 3.05rem;
            font-size: 0.75rem;
            color: #333;
        }
        .alipay{
            background: url(../images/icon_zfb.png) no-repeat 1.5rem 0.68rem;
            background-size: 1rem auto;
        }
        .wechat{
            background: url(../images/icon_wx.png) no-repeat 1.5rem 0.68rem;
            background-size: 1rem auto;
        }
        .payment-radio{
            display: flex;
            display: -webkit-flex;
            justify-content: center;
            align-items: center;
            width: 15px;
            height: 15px;
            border: solid 1px #999;
            border-radius: 50%;
        }
        .payment-radio .checked{
            display: block;
            width: 7px;
            height: 7px;
            background-color: #d93b2a;
            border-radius: 50%;
        }
        input{
            margin-left: 1.52rem;
            width: 65%;
            height: 1.27rem;
            font-size:0.7rem ;
            color: #000;
            border: none;
            border-bottom: solid 1px #f2f2f2;
        }
        input::-webkit-input-placeholder{
            color: #999;
        }
        
    }
        .bottom{
            padding-bottom:1.25rem ;
            border-top: 0.5rem solid #F2F2F2;
        }
        button{
            margin-top: 2.55rem;
            width: 80%;
            margin:2.55rem 10% 0 10%;
            height: 1.87rem;
            font-size: 0.9rem;
            color: #fff;
            background: #ccc;
            box-shadow: -5px 8px 20px 0px rgba(0, 0, 0, 0.3);
            border-radius: 40px;
        }
        .btn{
            
             background: #d93b2a;
        }
    .useragrre{
        margin-top: 1.5rem;
        text-align: center;
        font: 0.6rem /1.5 "";
        .useragrre-p{
            color: #999;
        }
        .useragrre-a{
            display: inline-block;
            color: #00aaff;
        }
        .useragrre-em{
            display: inline-block;
            width: 0.65rem;
            height: 0.65rem;
            background: url(../images/fangkuang.png) 0 0 no-repeat ;
            background-size: .65rem;
            margin:.05rem .3rem .1rem .3rem;
            vertical-align:middle ;
        }
    }
    .useragrre.active .useragrre-em{
        background: url(../images/fangkuang2.png) 0 0 no-repeat;
        background-size: .65rem;
    }
}
/*******提现**end*/

/*******充值**start*/
.recharge{
    header.header-color{
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .mui-content{
        background: #fff;
        .content{
            position: relative;
            border-bottom: solid 0.5rem #f2f2f2;
            .content-title{
                padding: 0 0.75rem;
            }
            .content-title h3{
                width: 100;
                font: 0.8rem/2.17rem "";
                color: #666;
                border-bottom: solid 1px #e5e5e5;
            }
            .box{
                display:flex;
                display: -webkit-flex;
                flex-wrap: wrap;
                justify-content: space-between;
            }
            .box-top{
                width: 100%;
                font: 0.7rem/2.1rem "";
                color: #666;
                padding: 0 0.75rem;
            }
            .price{
                position: relative;
                display: block;
                width: 100%;
                font: 0.7rem/2.3rem "";
                color: #333;
                border-bottom: 1px solid #d9d9d9;
                padding: 0 0.75rem 0 2.5rem;
                background: url(../images/icon_jb.png) 0.75rem center no-repeat;
                background-size: 0.9rem auto;
            }
            .price:last-child{
                border-bottom: 0;
            }
            .price .color-span{
                color: #d93b2a;
                padding-right: .3rem;
            }
            .right-a{
                position: absolute;
                right: 0.75rem;
                top: 0;
                color: #333;
                font-size: .75rem;
            }
            em.right-a{
                line-height: 2.3rem;
            }
            .pitch em.right-a{
                color: #d93b2a;
            }
            .pitch{  
                background-color: #f8e2c3;
                box-shadow: 0px 1px 1px 0px  #cccccc;
            }
            .import{
                height: 2.3rem;
                font-size: 0.7rem;
                color: #333;
                background: transparent;
                border: 0;
                text-align: end;
                line-height: none!important;
            }
            .pitch .import{
                color: #d93b2a;
            }
            .import::-webkit-input-placeholder{
                color: #ccc;
            }
        }
        .payment{
            background: #fff;
            margin-bottom: .3rem;
            overflow: hidden;
            h3{
                padding: 0.8rem 0.75rem 0.35rem 0.75rem;
                font-size: 0.75rem;
                color: #333;
            }
            a{
                position: relative;
                display: block;
                float: left;
                width: 45%;
                font: 0.9rem /2.45rem "";
                color: #333;
                border: 1px solid #ccc;
                margin-left: 3%;
                margin-bottom: 0.75rem;
                text-align: center;
                overflow: hidden;
            }
            
            a em{
                display: inline-block;
                width: 1.25rem;
                height: 1.25rem;
                vertical-align: text-top;
            }
            #alipay em{
                background: url(../images/icon_zfb2.png) no-repeat 0 center;
                background-size: 1rem auto;
            }
            #wechat em{
                background: url(../images/icon_wx2.png) no-repeat 0 center;
                background-size: 1rem auto;
            }
            #web em{
                background: url(../images/icon_web.png) no-repeat 0 center;
                background-size: 1rem auto;
            }
            .active{
                border: 1px solid #f24130;
            }
            .xuan{
                position: absolute;
                bottom: -.5rem;
                right: -.5rem;
                display: none;
                width: 1rem;
                height: 1rem;
                background-color: #f24130;
                transform:rotate(45deg);
                -webkit-transform:rotate(45deg);
            }
            .gou{
                position: absolute;
                bottom: -.15rem;
                right: -.1rem;
                display: none;
                width: 0.5rem;
                height: .5rem;
                background: url(../images/icon_goun.png) no-repeat 0 0;
                background-size: .4rem;
            }
            .active .xuan,.active .gou{
                display: block;
            }
        }
    }
    footer{
        z-index: 9;
        box-sizing: ;
        display: flex;
        display: -webkit-flex;
        align-items: center;
        justify-content: space-between;
        position: absolute;
        bottom: 0;
        left: 0;
        box-sizing: border-box;
        padding-left: 0.75rem;
        width: 100%;
        height: 2.25rem;
        background: #fff;
        border-top: solid 0.03rem #e6e6e6;
        .price{
            font-size: 0.9rem;
        }
        .price span{
            color: #d93b2a;
        }
        button{
            width: 7.5rem;
            height: 100%;
            font-size: 0.9rem;
            color: #fff;
            background:#d93b2a;
            border-radius: 0;
        }
    }
    .rdntn{
        width: 90%;
        margin:1.6rem 5%;
        height: 2rem;
        background: #ccc;
    }
    .rdntn.color{
        background: #d93b2a;
    }
}
/*******充值**end*/

/*******我的粉丝,我的关注,我的好友**start*/
.serchfd{
    .mui-bar-nav ~ .mui-content,.mui-bar-nav ~ .mui-content > .mui-scroll-wrapper{
        padding-top: 4.7rem;
    }
    header.mui-bar {
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .serch{
        z-index: 9;
        position: absolute;
        left: 0;
        top: 2.2rem;
        width: 100%;
        height: 2.5rem;
        border-bottom: 1px solid #E6E6E6;
        background-color: #fff;
        padding: .5rem 5%;
    }
    .serch-input{
        width: 100%;
        height: 1.5rem;
        border-radius: .3rem;
        border: 0;
        background-color: #F2F2F2;
    }
    .active.serch{
        .serch-input{
           text-align: start; 
        }
        .search-em{
            left:3rem;
        }
    }
}
.myfans,.attention,.myfriend{
    header.mui-bar{
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .main{
        font-size: 0;
    }
    .mui-content{
        background: #fff;
    }
    .fold{
        width: 100%;
        border-bottom: solid 0.5rem #f5f5f5;
    }
    .fold-a{
        position: relative;
        display: flex;
        display: -webkit-flex;
        align-items: center;
        box-sizing: border-box;
        padding: 0 0.75rem;
        width: 100%;
        height: 2.25rem;
        font-size: 0.55rem;
        color: #333;
        span{
            color: #d93b2a;
        }
        i{
            position: absolute;
            right: 0.5rem;
            top: 0.4rem;
            padding: .45rem;
            font-size: 1rem;
            color: #999;
        }
    }
    .fold-title{
        padding-right: 0.5rem;
        font: 0.8rem/1.5 "";
    }
    .fold-text{
        position: relative;
        display: flex;
        display: -webkit-flex;
        align-items: center;
        box-sizing: border-box;
        padding: 0 0.75rem;
        height: 3.5rem;
        border-top: solid 1px #e6e6e6;
        img{
            width: 2rem;
            height: 2rem;
            border-radius: 50%;
        }
        .box{
            padding-left: 0.5rem;
        }
    }
    .mf-table-view-cell,.shield,.userphone,.setfriend{
        position: relative;
        left: 0;
        box-sizing: border-box;
        padding: 0 0.75rem;
        display: flex;
        display: -webkit-flex;
        align-items: center;
        height: 3.5rem;   
        border-bottom: solid 1px #f5f5f5;
        transform: translateX(0);
        -webkit-transform: translateX(0);
        transition: transform 350ms ;
        -webkit-transition:transform 350ms ;
        .delect{
            position: absolute;
            top: 0;
            right: -20%;
            width: 20%;
            height: 100%;
            background: url(../images/icon_delete2.png) center no-repeat ;
            background-size: 0.65rem auto;
        }
    }
    .mf-table-view-cell img,.shield img,.userphone img{
        width: 2rem;
        height: 2rem;
        border-radius: 50%;
    }
    .shield ,.userphone{
        margin-right: 1.2rem;
        margin-left: 0.75rem;
        padding-left: 0;
        border-bottom-color: #F5F5F5;
       .arrows{
            padding: .7rem;
            color: #d93b2a;
            font-size: 0.6rem;
        } 
    }
    .shield .user{
        font-size: .9rem;
    }
    .userphone .phone{
        font: 0.7rem /1.5 "";
        color: #666;
    }
    .setfriend{
        width: 100%;
        height: 2.35rem;
        padding:0 1rem;
        .img{
            width: 1.5rem;
            height: 1.5rem;
            border-radius: 50%;
            margin: 0.425rem 0;
        }
        .user{
            display: inline-block;
            padding-left: 0.575rem;
            font: 0.9rem/2.35rem "";
            color: #333;
        }
    }
    .mf-navigate-right{
        padding-left: 0.5rem;
    }
    .user{
        display: block;
        max-width: 10rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 0.7rem;
        color: #333;
        min-height: .9rem;
    }
    .age{
        float: left;
        text-align: center;
        margin-right: 0.35rem;
        display: flex;
        display: -webkit-flex;
        align-items: center;
        justify-content: center;
        margin-top: 0.25rem;
        height: 0.85rem;
        padding: 0 .2rem;
        background: #e75d4e;
        border-radius: 0.15rem;
        img{
            width: 0.5rem;
            height: .5rem;
            border-radius: 0;
        }
        span{
            padding-left: 0.2rem;
            font-size: 0.55rem;
            line-height: 0.85rem;
            color: #fcfaf8;
            margin-bottom: .05rem;
        }
    }
    .sex{
        background-color: #db27bb;
    }
    .arrows{
        position: absolute;
        right: 0.25rem;
        top: 50%;
        padding: .45rem;
        transform: translate(0,-50%);
        -webkit-transform:  translate(0,-50%);
        font-size: 1rem;
        color: #999;
    }
    .abolish{
        position: absolute;
        right: 0.75rem;
        top: 50%;
        width: 3.25rem;
        transform: translate(0,-50%);
        -webkit-transform:  translate(0,-50%);
        height: 1rem;
        font-size: 0.6rem;
        background: none;
        border: solid 1px #ccc;
        border-radius: 0;
        color: #666;
        border-radius: .2rem;
    }
    .userimg{
        position: relative;
        width: 2rem;
        height: 2rem;
    }
    .new{
        position: absolute;
        top: 0;
        right: 0;
        display: block;
        width: .55rem;
        height: .5rem;
        background-color: #f24130;
        border-radius: 10rem;
    }
    a.title{
        display: inline-block;
        margin-top: -1px;
        width: 100%;
        height: 1rem;
        background-color: #f5f5f5;
        font: 0.5rem /1rem "";
        color: #666;
        padding:0 1.1rem;
    }
}

.myfans{
    .age{
        width: 3.1rem;
    }
}
.myfriend .mf-table-view-cell{
    margin-right: 1.2rem;
    margin-left: 0.75rem;
    padding-left: 0;
    .arrows{
        right:.5rem;
    }
}
.newfriend .mf-table-view-cell{
    margin-right: 0;
}
.myfriend { 
    .fold-a i{
        right:1.7rem;
    }
    .card-box {
        display: none;
    }
    .card-box .mui-popup-inner{
        padding: 0;
    }
    .card-box .mui-popup-title{
        border: 0;
        text-align: start;
        font-size: 0.9rem;
    }
    .card-box .mui-popup-buttons{
        margin-top: 1rem;
    }
    .card-box .mui-popup-text{
        text-align: start;
        margin: 0;
        padding: 0;
    }
    .osetfname{
        padding-left: .5rem;
    }
    .osetfurl{
        width: 2rem;
        height: 2rem;
        border-radius: 50%;
        margin-left: 1rem;
        margin-top: 1rem;
        vertical-align: text-bottom;
    }
    .osettext{
        padding-left: 0.75rem;
        display: inline-block;
    }
    .ousname{
        color: #fff;
        font: 0.8rem/1.5 "";
    }
    .ousid{
        color: #ccc;
        font: 0.7rem /1.5 "";
    }
}
.attention{
    .mf-table-view-cell{
        margin-right: 1rem;
    }
}
.myfans .arrows{
    right: 1.5rem;
}
/*******我的粉丝,我的关注,我的好友**end*/

/*******我的好友**start*/
.myfriend{
    .fold{
        border-bottom: 0;
    }
}
/*******我的好友**end*/

/*******我的约会**start*/
.appointment{
    .mui-scroll-wrapper{
        display: none;
    }
    .active.mui-scroll-wrapper{
        display: block;
    }
    header.mui-bar {
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .tab{
        position: absolute;
        top: 2.2rem;
        left: 0;
        z-index: 3;
        display:flex;
        display: -webkit-flex;
        justify-content: space-between;
        box-sizing: border-box;
        padding: 0 3.3rem;
        width: 100%;
        height: 2.12rem;
        border-bottom: solid 1px #e6e6e6;
        background-color: #fff;
        a{
            line-height: 2.12rem;
            font-size: 0.7rem;
            color: #666;
        }
        .pitch{
            color: #d93b2a;
            border-bottom: solid 0.15rem #d93b2a;
        }
    }
    .mui-bar-nav ~ .mui-content > .mui-scroll-wrapper {
        padding-top: 4.32rem;
    }
    .mui-content{
        background: #fff;
        .receive{
            .receive-box,.launch-box,.launch-agree{
                box-sizing: border-box;
                padding: 0 0.75rem;
                border-bottom: solid 0.5rem #f5f5f5;
            }
            .roll{
                position: relative;
                transition: margin-left 350ms ease;
                -webkit-transition: margin-left 350ms ease;
                width: 100%;
            }
            .content{
                display: -webkit-flex;
                align-items: center;
                height: 3.5rem;
                border-bottom: solid 1px #e6e6e6;
                margin-right: 1.175rem;
            }
            .mui-icon-arrowright{
                position: absolute;
                top: 50%;
                right: -.5rem;
                margin-top: -.65rem;
                color: #999;
                font-size: 1.3rem;
            }
            i.delect{
                position: absolute;
                top: 0;
                right:-40%;
                margin-right:-.8rem;
                height: 100%;
                width: 20%;
                background:url(../images/icon_delete2.png) center no-repeat ;
                background-size: 0.65rem auto;
            }
            i.complaint{
                position: absolute;
                top: 0;
                right:-20%;
                margin-right:-.8rem;
                height: 100%;
                width: 20%;
                background: url(../images/chat_ts.png) center no-repeat;
                background-size: 0.775rem auto;
            }
            .content-img{
                width: 2rem;
                height: 2rem;
                border-radius: 50%;
                overflow: hidden;
            }
            .content-img img{
                height: 100%;
                width: 100%;
            }
            .content-right{
                padding-left: 0.5rem;
            }
            .content-right h3{
                font: 0.7rem/1.3 "";
                width: 10rem;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            .content-right p{
                padding-top: 0.35rem;
                font: 0.55rem/1.5 "";
                color: #999;
            }
            .btn{
                display: -webkit-flex;
                justify-content:center;
                align-items: center;
                box-sizing: border-box;
                height: 2.65rem;
            }
            .btn a{
                display: block;
                width: 3.5rem;
                font: 0.6rem/1rem "";
                text-align: center;
                color: #D93B2A;
                border: solid 1px #d93b2a;
                border-radius: 0.15rem;
                margin: 0 0.5rem;
            }
            .lose-box .content{
                position: relative;
            }
            .lose-box .agree,.lose-box .cancel,.btn .evaluate{
                color: #ccc;
                border: solid 1px #ccc;
            }
            .agree-box .evaluate{
                color: #D93B2A;
                border: solid 1px #d93b2a;
            }
            .lose-img{
                position: absolute;
                right:0;
                top: .56rem;
                width: 2.15rem;
                height: 2.15rem;
            }
            .lose-box .lose-img{
                background: url(../images/icon_ysx.png) no-repeat;
                background-size: 100%;
            }
            .agree-box .lose-img{
                margin-right: 1.175rem;
                background: url(../images/icon_agree.png) no-repeat;
                background-size: contain;
            }
            .agree-box .agree{
                color: #fff;
                background-color: #d93b2a;
            }
            .evaluate-box{
                position: relative;
                margin: 0.25rem 0.75rem 1rem 0.75rem;
                box-shadow: 0px 10px 26px 0px  rgba(179, 179, 179, 0.3);
                p.title{
                    width: 100%;
                    text-align: end;
                    span.title-span{
                        display: inline-block;
                        width: 40%;
                        text-align: center;
                        font: 0.7rem/2.25rem "";
                        color: #666;
                    }
                }
                ul{
                    padding: 0 .4rem;
                   li{
                       display: -webkit-flex;
                       justify-content: space-around;
                       align-content: center;
                       margin-bottom: 0.75rem;
                       span{
                           width: 38%;
                           padding-left: 2%;
                           display: -webkit-flex;
                           justify-content: space-around;
                           align-content: center;
                       }
                       span.text{
                           display: inline-block;
                           width: 20%;
                           padding: 0;
                           text-align: center;
                           font: 0.65rem/1.5 "";
                           color: #666;
                       }
                        em,i{
                            vertical-align: text-bottom;
                            display: inline-block;
                            padding: 1rem 0.4rem;
                        }
                        i{
                            background: url(../images/icon_aixin2.png) center center no-repeat;
                            background-size: 0.75rem auto;
                        }
                        i.active{
                            background: url(../images/icon_aixin1.png) center center no-repeat;
                            background-size: 0.75rem auto;
                        }
                        em{
                            background: url(../images/bad0.png) center center no-repeat;
                            background-size: 0.65rem auto;
                        }
                        em.active{
                            background: url(../images/bad1.png) center center no-repeat;
                            background-size: 0.65rem auto;
                        }
                   } 
                }
                .rdntn{
                    width: 6.75rem;
                    height: 1.5rem;
                    font-size: 0.65rem;
                    margin-bottom: 1.5rem;
                }
                .rdntn-p{
                    text-align: center;
                }
                .sex{
                    margin:1.2rem 0.75rem 1.2rem 0.75rem;
                    font: 0.7rem /1.5 "";
                    color: #333;
                    .color{
                        color: #d93b2a;
                    }
                }
            }
            .evaluate-box::after{
                position: absolute;
                right:-.5rem;
                top: -.3rem;
                content:"";
                display: block;
                border: .7rem solid #fff;
            }
            .evaluate-box::before{
                z-index: 999;
                position: absolute;
                right:0;
                top: 0;
                width:0;
                content:"";
                display: block;
                border: .5rem solid #fff;
                border-color: transparent transparent rgba(235, 235, 235, 0.5) rgba(235, 235, 235, 0.5);
                background-color: #fff; //设置为透明的话,会显示绿底;
                /*设置元素的阴影效果*/
                box-shadow: -3px 4px 7px 0px rgba(0, 0, 0, 0.2);
            }
        }
    }
    
}
/*******我的约会**end*/

/*******评价**start*/
.evaluate{
    .mui-content{
        background: #fff;
    }
    .estimeate-list {
        padding: 0.4rem 0.75rem;
    }
    .estimeate-item.estimeate-range {
        height: auto;
        padding-top: 1rem;
    }
    .estimeate-item {
        height: 2.2rem;
        line-height: 2.2rem;
        font-size: 0.7rem;
        color: #666;
        padding: 0;
        .grade {
            height: 2.2rem;
            float: right;
            overflow: hidden;
        }
        .star {
            display: inline-block;
            padding: 1.1rem 0.8rem;
            background: url(../images/icon_xx0.png) center center no-repeat;
            background-size: contain;
        }
        .star.active {
            background-image: url(../images/icon_xx1.png);
        }
    }
    .btn{
        box-sizing: border-box;
        padding: 9.62rem 1.87rem 0 1.87rem;
        width: 100%;
    }
    .btn .rdntn{
        width: 100%;
        height: 2rem;
    }
}
/*******评价**end*/

/*******个人认证**start*/
.attestation{
    header.mui-bar {
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .mui-content::-webkit-scrollbar{display: none;}
    .mui-content{
        overflow-y: scroll;
        background: #fff;
        .personal{
            width: 100%;
        }
        .personal-content{
            display: -webkit-flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: space-between;
            box-sizing: border-box;
            padding: 0 0.7rem;
            border-bottom: solid 1px #e6e6e6;
        }
        .personal-content span{
            font-size: 0.7rem;
            color: #333;
        }
        .personal-content input{
            flex: 1;
            -webkit-flex: 1;
            height: 2.12rem;
            font-size: 0.7rem;
            text-align: right;
            border: 0;
        }
        .personal-content .personal-title{
            padding: 0.72rem 0.75rem 1rem 0.75rem;
            width: 100%;
            font-size: 0.65rem;
            color: #333;
        }
        .content-img,.add-img,.content-video,.add-video{
            float: left;
            position: relative;
            margin: 0 0 1rem 0.75rem ;
            width: 5.25rem;
            height: 5.25rem;
        }
        .content-img img,.add-img img{
            width: 100%;
            height: 100%;
        }
        .content-img i,.add-img i,.add-video i,.content-video i{
            position: absolute;
            right: -0.7rem;
            top: -0.8rem;
            display: block;
            padding: 0.75rem 0.75rem;
            background: url(../images/icon_sc.png) center center no-repeat;
            background-size: 0.65rem auto;
        }
        .personal-img,.personal-video{
            padding: 0;
        }
        .add-img{
            float: left;
            background: url(../images/icon_jia.png) center center no-repeat;
            background-size: contain;
        }
        .add-video{
            float: left;
        }
        .video-bg{
            width: 100%;
            height: 100%;
            background: url(../images/icon_zxj.png) center center no-repeat;
            background-size: contain;
        }
        .add-img p{
            padding-top: 3.15rem;
            font: 0.7rem/1.5 "";
            text-align: center;
            color: #ccc;
        }
        .add-img span{
            color: #ccc;
        }
        .content-video{
            background-size: contain;
        }
        .video-em{
            display: inline-block;
            width: 2rem;
            height: 2rem;
            background: url(../images/videoplay.png) center no-repeat;
            background-size: 100%;
        }
        .shade{
            z-index: 99;
            position: absolute;
            left: 0;
            top: 0;
            display: -webkit-flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.47);
        }
        .add{
            width: 100%;
            height: 100%;
        }
        .btn{
            box-sizing: border-box;
            padding: 2.5rem 1.87rem ;
            width: 100%;
        }
        .btn .rdntn{
            width: 100%;
            height: 2rem;
        }
        .content-img{
            position: relative;
        }
        .content-p{
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 1.42rem;
            background-color: rgba(0, 0, 0, 0.4);
            font: 0.7rem /1.42rem "";
            color: #fff;
            text-align: center;
        }
    }
}
/*******个人认证**end*/

/*******约会认证**start*/
.dataattestation,.handler{
    .rdntn,.useragrre{
        display: none;
    }
    .btn{
        clear: both;
        overflow: hidden;
    }
    .btn a,.register .agree,.register .disagree{
        display: none;
        width: 3rem;
        height: 3rem;
        box-shadow: 0px 10px 26px 0px  rgba(179, 179, 179, 0.4);
        border: solid 0.1rem #cccccc;
        border-radius: 50%;
        margin:0 1rem;
    }
    .agree{
        float: left;
        background: url(../images/icon_gou.png) center no-repeat;
        background-size: 1.5rem auto;
    }
    .disagree{
        float: right;
        background: url(../images/icon_cha.png) center no-repeat;
        background-size: 1.13rem auto;
    }
}
/*******约会认证**end*/

/*******编辑个人中心**start*/
.editdata{
    .img-look.active{
        display: block;
    }
    header{
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
        .mui-pull-right{
            margin-right: 0.25rem;
            font: 0.75rem/2.2rem "";
        }
    }
    li{
        color: #333;
    }
    .mui-content{
        background: #fff;
        overflow: scroll; 
        .mymsg .dw{
            color: #999;
        }
        .add-box{
            width: 100%;
            padding: 0.22rem 0;
            border-bottom: solid 0.5rem #F5F5F5;
            overflow: hidden;
        }
        .box-img{
            float: left;
            margin: 0 0 0.17rem 0.23rem;
            width: 5.95rem;
            height: 5.95rem;
            overflow: hidden;
        }
        .box-img img{
            width: 100%;
            min-height: 100%;
            background-color: #F2F2F2;
        }
        .add-img,.face{
            float: left;
            margin: 0 0 0.17rem 0.23rem;
            width: 5.95rem;
            height: 5.95rem;
            background: url(../images/icon_jiajia.png)center center no-repeat #F2F2F2;
            background-size: 1.35rem auto;
        }
        .face .face-p{
            color: #B6B6B6;
            font-size: .7rem;
            text-align: center;
            margin-top: 4rem;
            line-height: 1rem;
        }
        .message-box{
            width: 100%;
        }
        .message-title{
            box-sizing: border-box;
            padding: 0 0.75rem;
            width: 100%;
            font: 0.7rem/ 2.15rem "";
            color: #ff3333;
            border: solid 1px #f5f5f5;
        }
        .message{
            box-sizing: border-box;
            padding: .2rem 0.75rem .2rem 0.75rem;
            border-bottom: solid 0.5rem #f5f5f5;
        }
        .message li{
            display: -webkit-flex;
            width: 100%;
            border-bottom: solid 1px #f5f5f5;
        }
         .message li:last-child{
             border: 0;
         }
        .message li span{
            font: 0.7rem/2.12rem "";
        }
        .message li input,.message li .editdata-data,.message li .hwbox{
            color: #333;
            flex: 1;
            -webkit-flex: 1;
            padding-left: 1.25rem;
            font: 0.7rem/2.2rem "";
            border: 0;
        }
        .myinf li{
            padding-left: 2rem;
            vertical-align: middle;
            border-bottom: 0;
        }
        .myinf li p{
            font:0.7rem/1.5"" ;
            margin:.6rem 0;
        }
        .myinf li:nth-of-type(1){
            background: url(../images/gr_1.png) 0 .7rem no-repeat;
            background-size: 0.875rem auto;
        }
        .myinf li:nth-of-type(2){
            background: url(../images/gr_2.png) 0 .7rem  no-repeat;
            background-size: 0.875rem auto;
        }
        .myinf li:nth-of-type(3){
            background: url(../images/gr_3.png) 0 .7rem  no-repeat;
            background-size: 0.875rem auto;
        }
        .myinf li:nth-of-type(4){
            background: url(../images/gr_4.png) 0 .7rem  no-repeat;
            background-size: 0.875rem auto;
        }
        .myinf li:nth-of-type(5){
            background: url(../images/gr_5.png) 0 .7rem  no-repeat;
            background-size: 0.875rem auto;
        }
        .myinf li,.biaoqian-p,.con-lick{
            color: #333;
            font: 0.7rem/2.25rem "";
            width: 100%;
        }
        .biaoqian-p{
            color: #8f8f94;
        }
        .myinf li span.jia{
            color: #ff3333;
            margin-right: .3rem;
            font: 0.7rem/1 "";
            margin-left: -.75rem;
        }
        .con-biaoqian li{
            padding-left: 2.2rem;
            background: url(../images/biaoqian.png) 0 0.7rem no-repeat;
            background-size: 0.85rem auto;
            border-bottom: 0;
        }
        .biaoqian-p span.jia{
            color: #ff85bc;
            margin-left: -.75rem;
            margin-right: .3rem;
        }
        .con-lick li{
            padding-left: 2.3rem;
            border-bottom: 0;
        }
        .con-lick span.jia{
            margin-right: .3rem;
        }
        .con-lick li:nth-of-type(1){
            background: url(../images/paobu.png) 0 0.7rem no-repeat;
            background-size: 0.85rem auto;
            .jia{
                color: #865ff3;
            }
            .biaoqian-p a{
                background-color: #865ff3;
                margin-bottom: .35rem;
            }
        }
        .con-lick li:nth-of-type(2){
            background: url(../images/yingyue.png) 0 0.7rem no-repeat;
            background-size: 0.85rem auto;  
            .jia{
                color: #ff3333;
            }
            .biaoqian-p a{
                background-color: #ff3333;
            }
        }
        .con-lick li:nth-of-type(3){
            background: url(../images/foot.png) 0 0.7rem  no-repeat;
            background-size: 0.875rem auto;
            .jia{
                color: #d5c32c;
            }
            .biaoqian-p a{
                background-color: #d5c32c;
            }
        }
        .con-lick li:nth-of-type(4){
            background: url(../images/dianying.png) 0 0.7rem  no-repeat;
            background-size: 0.875rem auto;
            .jia{
                color: #2e337a;
            }
            .biaoqian-p a{
                background-color: #2e337a;
            }
        }
        .con-lick li:nth-of-type(6){
            background: url(../images/lvxing.png) 0 0.7rem  no-repeat;
            background-size: 0.875rem auto;
            .jia{
                color: #3c73ef;
            }
            .biaoqian-p a{
                background-color: #3c73ef;
            }
        }
        .con-lick li:nth-of-type(5){
            background: url(../images/shu.png) 0 0.7rem  no-repeat;
            background-size: 0.875rem auto;
            .jia{
                color: #ef813e;
            }
            .biaoqian-p a{
                background-color: #ef813e;
            }
        }
        
    }
    .table-view-cell-input{
        background: transparent;
        color: #E6E6E6;
        border: 0;
        margin-top: 2rem ;
        padding: 0 .5rem;
    }
    .table-view-cell-input::-webkit-scrollbar{display: none;}
    .table-view-cell-input::-webkit-input-placeholder{color: #E6E6E6;}
    .table-view1{
        bottom: auto;
        top: 3.2rem;
        transform: translate(0,0);
        -webkit-transform:  translate(0,0);
    }
    .table-view2,.table-view3{
        .table-con{
            max-height: 24rem;
            overflow-y: scroll;
        }
        .title-p{
            border-bottom: 0!important;
        }
    }
    .table-con::-webkit-scrollbar{display: none;}
    .table-view .table-view-cell a.table-view-cell-a{
        padding:0 .5rem ;
        border-bottom: 0;
        line-height: 2.5;
    }
    .table-view .table-view-cell a.table-view-cell-cancel,.table-view .table-view-cell a.table-view-cell-affirm{
        padding: 0 .5rem 0 1.5rem;
        font:0.62rem / 2.5rem "";
    }
    .biaoqian-p a{
        display: inline-block;
        background: rgba(255, 133, 188, 0.6);
        color: #fff;
        font: 0.55rem / 1.05rem "";
        padding: 0.1rem 0.6rem 0.2rem 0.6rem;
        margin-right: 0.25rem;
        border-radius: 0.2rem;
        margin-bottom: .35rem;
    }
    .add-inf{
        color: #ccc;
    }
}
/*******编辑个人中心**end*/

/*******搜索**start*/
.search{
    header.header-color .mui-icon.mui-pull-left{
       color: #000000;
    }
    .mui-scroll{
        height: 100%;
    }
    .mui-pull-right{
        font: .75rem/1.5 "";
        width:4.5rem;
        text-align: center;
    }
    header{
        .search-seek {
            display: block;
            position: absolute;
            left: 50%;
            height: 2.2rem;
            width: 60%;
            -webkit-transform: translateX(-56%);
            transform: translateX(-56%);
        }
        .search-seek input {
            display: block;
            position: absolute;
            top: 50%;
            margin: 0;
            margin-top: -0.65rem;
            padding-left: 1.42rem;
            height: 1.3rem;
            font-size: 0.6rem;
            background-color: #ededed;
            color: #666;
            border: none;
            border-radius: 5rem;
        }
        .search-seek input::-webkit-input-placeholder{
            color: #b2b2b2;
        }
        .search-icon-seek{
            position: absolute;
            top: 0.75rem;
            margin-left: 0.52rem;
            display: block;
            width: 0.7rem;
            height: 0.7rem;
            background: url(../images/icon_serch2.png) center no-repeat;
            background-size: contain;
        }
    }
    .mui-content{
        background: #fff;
        .friends-box{
            position: absolute;
            top: 0.4rem;
            left: .2rem;
            box-sizing: border-box;
            padding: 0 0.25rem;
            width: 100%;
        }
        .img-amount{
            float: left;
            display: inline-block;
            padding: 0 0.32rem 0 1.1rem;
            max-width: 80%;
            line-height: 0.85rem;
            font-size: 0.6rem;
            color: #fff;
            background: url(../images/icon_img.png) 0.35rem center no-repeat;
            background-color: rgba(0, 0, 0, 0.4);
            background-size: 0.5rem auto;
            border-radius: 0.25rem;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .friends{
            float: left;
            margin-left: 0.2rem;
            width: 0.85rem;
            height: 0.85rem;
            background: url(../images/icon_pyq.png) center no-repeat;
            background-color: rgba(0, 0, 0, 0.4);
            background-size: 0.47rem auto;
            border-radius: 0.25rem;
        }
        .recommend{
            background-color: #fff;
            display: block;
            width: 100%;
            overflow: hidden;
        }
        .recommend-title{
            padding: 0.4rem 0.75rem 0 0.75rem;
            font: 0.7rem/2.17rem "";
            color: #333;
            .sexall,.sexman,.sexwman{
                background-color: #e6e6e6;
                border-radius: .2rem;
                color: #000;
                padding: 0.2rem 1rem 0.2rem 1rem;
                margin-left: 1rem;
                font: 0.7rem/1.5 "";
            }
            a.active{
                color: #fff;
                background-color: #d93b2a;
            }
        }
        .recommend-title2{
            color: #cccccc;
            font: 0.7rem /2.5rem "";
        }
        .recommend-box{
            box-sizing: border-box;
            padding: 0 0.72rem;
        }
        .recommend-box a{
            display: block;
            padding: 0 0.65rem;
            margin: 0 0.4rem 0.5rem 0;
            font: 0.7rem/1.6rem "";
            color: #333;
            border-bottom: 1px solid #e6e6e6;
        }
        .particulars{
            display: none;
            height: 100%;
        }
        .particulars .box{
            height:100%;
            position: relative;
            overflow: hidden;
        }
        .particulars-box{
            position: absolute;
            height: 92%;
            padding:0.4rem 0.25rem 0 .25rem;
            border-radius: 0.2rem;
            background-image: url(../images/index_bg.png) ;
            background-repeat: no-repeat;
            background-size: 100% 100%;
            padding-bottom: .5rem;
        }
        .particulars-box:before{
            z-index: 9;
            position: absolute;
            right:0;
            top: .5%;
            content:"";
            width: 1.5rem;
            height: 6%;
            background: url(../images/jiao0.png) center no-repeat;
            background-size: 100%;
        }
        .particulars-one{
            z-index: 4;
            top:0;
            left: .5rem;
            width: 17.75rem;
            transition: transform 350ms;
            -webkit-transition: transform 350ms;
        }
        .particulars-two{
            top:2%;
            z-index: 3;
            width: 17.375rem;
            left: .7rem;
        }
        .particulars-three{
            top:3.5%;
            z-index: 2;
            width: 16.3rem;
            left: 1.2rem;
            transition: transform 350ms;
            -webkit-transition:    transform 350ms;
            background-image: none;
            box-shadow: 0px 8px 18px 0px    rgba(0, 0, 0, 0.16);
            border-radius: .3rem;
        }
        .particulars-img{
            width: 100%;
            height: 86%;
            position: relative;
            overflow: hidden;
            border-top-left-radius: .3rem;
            border-top-right-radius: 1.4rem;
            .p-img{
                height: 100%;
                position: absolute;
                left: 50%;
                transform: translate(-50%,0);
                -webkit-transform:   translate(-50%,0);
            }
            .p-img.p-imgh{
                width: 100%;
                height: auto;
                left: 0;
                top: 50%;
                transform: translate(0,-50%);
                -webkit-transform:   translate(0,-50%);
            }
        }
        .particulars-name{
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
            padding:  0 0.72rem;
            font:600 0.9rem/1.95rem "";
            color: #333;
            height: 1.95rem;
        }
        .particulars-div{
            display: -webkit-flex;
            align-items: center;
            justify-content: center;
            margin-left: 0.75rem;
            border-radius: 0.15rem;
            float: left;
            padding: 0 .2rem;
        }
        .particulars-div i{
            width: 0.5rem;
            height: 0.5rem;
        }
        .particulars-div span{
            margin-left: 0.15rem;
            font: 0.55rem/0.85rem "";
            color: #fcfaf8;
        }
        .particulars-age{
            background-color: #d93b2a;
            i.woman{
                background: url(../images/icon_girl.png) 0 0 no-repeat;
                background-size: contain;
            }
            i.man{
                background: url(../images/icon_boy.png) 0 0 no-repeat;
                background-size: contain;
            }
        }
        .vip{
            background-color:#f2c238 ;
            padding: 0 .5rem;
            font: 0.55rem/0.85rem "";
            color: #fcfaf8;
        }
        .particulars-meili{
            background-color: #db27bb;
        }
        .particulars-qianm{
            background-color: #38a1d7;
            border-radius: 10rem;
            i{
                height: 1rem;
                background: url(../images/yuyin2.png) center no-repeat;
                background-size: 0.425rem auto;
            }
        }
        .particulars-text{
            margin-bottom: 0.6rem;
            padding: 0.4rem 0.75rem 0.7rem 0.75rem;
            font: 0.7rem/1.5 "";
            color: #666;
        }
    }
}
/*******搜索**end*/
/*******首页**start*/
.index{
    .mui-pull-left{
        font-weight: 600;
    }
    .voice-editdata{
        height: 1.05rem;
        line-height: 1.05rem;
    }
    .con-voice-img{
        float: left;
        display: none;
        height: 1.05rem;
    }
    .mui-popup{
        z-index: 999999;
    }
    
    .popover{
        background-color: rgba(0,0,0,.5);
    }
    .search{
        z-index: 9;
        position: fixed;
        right: .5rem;
        bottom: 1rem;
        width: 3.725rem;
        height: 3.625rem;
        background-repeat: no-repeat;
        background-position: 0;
        background-size: contain;
        background-image:url(../images/icon_serchs0.png) ;
    }
    .search.active{
        background-image: url(../images/icon_serchs.png);
    }
    header{
        .mui-icon-bars:before{
            padding-left: 0.25rem;
        }
        .mui-icon-bars{
            margin-top: 0.07rem;
            font-size: 1.1rem;
            position: relative;
            i{
                width: .3rem;
                height: .3rem;
                background-color: #d93b2a;
                position: absolute;
                top: .5rem;
                right:.1rem;
                border-radius: 50%;
            }
        }
        .mui-pull-right{
            margin: 0 0.25rem;
            width: 1.1rem;
            height: 100%;
            background: url(../images/icon_inf.png) center no-repeat;
            background-size: 1.1rem auto;
            position: relative;
            i{
                width: .3rem;
                height: .3rem;
                background-color: #d93b2a;
                position: absolute;
                top: .4rem;
                right: -0.3rem;
                border-radius: 50%;
            }
        }
    }
    .mui-content{
        position: relative;
        background: #fff;
        overflow: hidden;
        .index-box{
            width: 100%;
            height: 100%;
            position: relative;
        }
        .box{
            position: absolute;
            height: 93%;
            padding: 2%;
            border-radius: 0.2rem;
            background-image: url(../images/index_bg.png) ;
            background-repeat: no-repeat;
            background-size: 100% 100%;
            padding-bottom: .5rem;
        }
        .box:before{
            z-index: 9;
            position: absolute;
            right:0;
            top: .5%;
            content:"";
            width: 1.5rem;
            height: 6%;
            background: url(../images/jiao2.png) center no-repeat;
            background-size: 100%;
        }
        .box-one{
            z-index: 4;
            top: 0rem;
            width: 17.75rem ;
            left:.5rem;
            -webkit-transition:transform 350ms;
            transition: transform 350ms;
        }
        .box-two{
            z-index: 3;
            top: 2%;
            width:17.35rem ;
            left: .7rem;
        }
        .box-three{ 
            z-index: 2;
            top: 4.8%;
            width: 16.3rem;
            left:1.2rem;
            padding: 0;
            height: 92%;
            transition: transform 350ms;
            -webkit-transition:transform 350ms;
            border: solid 1px #e6e6e6;
            background-image: none;
            box-shadow: 0px 8px 18px 0px rgba(0, 0, 0, 0.16);
            border-radius: 0.3rem;
            a.mp-user{
                display: none!important;
            }
        }
        .box a.mp-user{
            float: left;
            margin-top: 2.83%;
            margin-left: 2.63%;
            display: block; 
            width: 46.18%;
            height: 31.5%;
            background-color: #f5f5f5;
            overflow: hidden;
        }
        .box-img{
            position: relative;
            width: 100%;
            height: 75%;
            overflow: hidden;
        }
        .box-img img{ 
            display: block;
            float: left;
            position: absolute;
            min-height: 100%;
            width: 100%;
            left: 0;
        }
        .friends-box{
            position: absolute;
            top: 0.25rem;
            left: 0;
            box-sizing: border-box;
            padding: 0 0.25rem;
            width: 100%;
        }
        .img-amount{
            float: left;
            display: inline-block;
            padding: 0 0.32rem 0 1.1rem;
            max-width: 80%;
            line-height: 0.85rem;
            font-size: 0.6rem;
            color: #fff;
            background: url(../images/icon_img.png) 0.35rem center no-repeat;
            background-color: rgba(0, 0, 0, 0.4);
            background-size: 0.5rem auto;
            border-radius: 0.25rem;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .friends{
            float: left;
            margin-left: 0.2rem;
            width: 0.85rem;
            height: 0.85rem;
            background: url(../images/icon_pyq.png) center no-repeat;
            background-color: rgba(0, 0, 0, 0.4);
            background-size: 0.47rem auto;
            border-radius: 0.25rem;
        }
        .vip{
            margin-top: 0.32rem;
            padding: 0 0.3rem 0 0.3rem;
            float: left;
            font-size: 0.35rem;
            color: #fcfaf8;
            line-height: 0.55rem;
            border-radius: 0.1rem;
            margin-left: .2rem;
            background-color:#f2c238 ;
        }
        .box-text{
            box-sizing: border-box;
//          padding: 0 0.5rem;
            text-align: center;
            width: 100%;
        }
        .text-title{
            height: 1rem;
            padding: .35rem 0.5rem 0 0.5rem;
            text-align: start;
            float: left;
            overflow: hidden;
            width: 100%;
            line-height: 1;
            font-size: 0.6rem;
            text-overflow: ellipsis;
            white-space: nowrap;
            color: #999;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .box-text .age,.sexs,.voice{
            margin-top: 0.32rem;
            padding: 0 0.15rem 0 0.55rem;
            float: left;
            font-size: 0.35rem;
            color: #fcfaf8;
            line-height: 0.55rem;
            border-radius: 0.1rem;
            margin-left: .2rem;
        }
        .sexs{
            background-color: #db26bb;
            padding: 0 0.15rem 0 0.15rem;
        }
        .voice{
            background: url(../images/yuyin2.png) .2rem center no-repeat #38a1d7;
            background-size:auto 0.37rem ;
            border-radius: 10rem;
        }
        .box-text .woman{
            background: url(../images/icon_girl.png) 0.15rem center no-repeat;
            background-size: 0.3rem auto;
            background-color: #d93b2a;
        }
        .box-text .man{
            background: url(../images/icon_boy.png) 0.15rem center no-repeat;
            background-size: 0.3rem auto;
            background-color: #d93b2a;
        }
    }
    /*******消息**start*/
    .message1{
        right:0;
    }
    .message{
        display: none;
        position: fixed;
        right: -80%;
        -webkit-transition: right 200ms;
        transition: right 200ms ;
        top: 0;
        z-index: 9999;
        width: 80%;
        height: 100%;
        background: #fff;
        .delect{
            position: absolute;
            top: 0;
            right: -3.5rem;
            width: 3rem;
            height: 100%;
            background: url(../images/icon_delete2.png) center no-repeat ;
            background-size: 0.65rem auto;
        }
        .tab a  i {
            display: none;
        }
        .message-header{
            width: 100%;
            height: 2.2rem;
            font:600 0.9rem/2.2rem "";
            text-align: center;
            color: #333;
        }
        .friends{
            margin: 0.75rem 0 1rem 0;
            box-sizing: border-box;
            padding: 0 0.7rem;
            width: 100%;
            height: 2.5rem;
        }
        .friends-box{
            height: 100%;
            background: url(../images/icon_pyq.png) 0.77rem 50% no-repeat;
            background-size: 1.27rem auto;
            background-color: #999;
            border-radius: 0.25rem;
        }
        .friends-box span{
            float: left;
            padding-left: 2.65rem;
            font: 0.8rem/2.5rem "";
            color: #fff;
        }
        .friends-img{
            position: relative;
            float: right;
            margin-top: 0.45rem;
            margin-right: 0.67rem;
            width: 1.57rem;
            height: 1.57rem; 
        }
        .friends-img img{
            display: block;
            float: left;
            width: 1.57rem;
            height: 1.57rem; 
            border-radius: 50%;
        }
        .circle{
            position: absolute;
            right: -0.2rem;
            top: 0;
            width: 0.5rem;
            height: 0.5rem;
            background-color: #f24130;
            border-radius: 50%;
        }
        .message-back{
            display: block;
            background: url(../images/icon_back0.png) right center no-repeat;
            background-size: 0.4rem auto;
            width: 2.5rem;
            height: 2.5rem;
            float: right;
            margin-right: .5rem;
        }
        
        .tab-box{
            box-sizing: border-box;
            padding: 0 0.5rem;
            .mui-scroll-wrapper:last-of-type{
                display: none;
            }
        }
        .tab{
            overflow: hidden;
        }
        .tab a{
            box-sizing: border-box;
            float: left;
            display: block;
            width: 50%;
            height: 1.4rem;
            font: 0.7rem/1.4rem "微软雅黑";
            text-align: center;
            color: #999;
        }
        .tab a span{
            position: relative;
        }
        .friends-box span{
            position: relative;
        }
        .tab a i,.friends-box-i{
            position: absolute;
            top: 0.05rem;
            right: -.5rem;
            width: 0.3rem;
            height: 0.3rem;
            background-color: #f24130;
            border-radius: 50%;
        }
        .friends-box-i{
            top: .6rem;
            right: -.5rem;
        }
        .tab .pitch{
            height: 1.37rem;
            color: #f24130;
            border-bottom: solid 0.07rem #f24130;
        }
        .mui-scroll-wrapper{
            margin-top: 7.82rem;
        }
        .box{
            box-sizing: border-box;
            padding: 0 0.5rem;
            margin-top: 0.45rem;
        }
        .box li{
            position: relative;
            left: 0;
            display: -webkit-flex;
            align-items: center;
            width: 100%;
            height: 3.55rem;
            transition: left 350ms ;
            -webkit-transition: left 350ms ;
            border-bottom: solid 1px #e6e6e6;
        }
        .box .tab-img img{
            display: block;
            float: left;
            width: 2.75rem;
            height: 2.75rem;
            border-radius: 50%;
        }
        .box .tab-img{
            position: relative;
        }
        .box .tab-img span{
            position: absolute;
            display: block;
            top: 0;
            right: -0.1rem;
            width: 0.75rem;
            font: 0.45rem/0.75rem "";
            color: #fff;
            text-align: center;
            border-radius: 50%;
            background-color: #f24130;
        }
        .box-text{
            width: 100%;
            padding-left: 0.75rem;
            .chat-list{
                height: 1.3rem;
                overflow: hidden;
            }
            .text-title{
                width: 50%;
                font-size: 0.75rem;
                color: #333;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                height: 1rem;
            }
            p{
                width: 65%;
                font-size: 0.6rem;
                color: #999;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                margin-top: .3rem;
                .face-bq{
                    width: 1rem;
                    height: auto;
                    margin: 0 .2rem;
                    vertical-align: bottom;
                }
            }
        }
        .time{
            position: absolute;
            top: 50%;
            margin-top: -0.4rem;
            right: 0;
            font-size: 0.6rem;
            color: #999;
        }
    }
    /*******消息**end*/
    
    /*******个人中心**start*/
    .mycenter{
        display: none;
        z-index: 9999;
        position: fixed;
        top: 0;
        left: -80%;
        -webkit-transition: left 200ms ;
        transition: left 200ms ;
        width: 80%;
        height: 100%;
        background: #fff;
        .mycenter-header{
            height: 10.8rem;
            background: url(../images/grzx-bg.png) 0 0 no-repeat;
            background-size: 100% auto;
            .signin{
                box-sizing: border-box;
                padding: 0 0.75rem;
                width: 100%;
                height: 2.2rem;
                .yp{
                    float: left;
                    line-height: 2.2rem;
                    font-size: 0.7rem;
                    color: #eee;
                }
            }
            .signin a{
                float: right;
                width: 3rem;
                line-height: 2.2rem;
                font-size: 0.7rem;
                color: #eee;
                text-align: right;
                background: url(../images/icon_my_kb.png) left 0.6rem no-repeat;
                background-size: 0.9rem auto;
            }
            .header-box{
                box-sizing: border-box;
                padding: 0 0.75rem;
                height: 6.6rem;
                text-align: center;
            }
            .userimg{
                width: 3.37rem;
                height: 3.37rem;
                overflow: hidden;
                border-radius: 50%;
                border: 1px solid #fff;
                margin: 0  auto;
            }
            .userimg img{
                display: block;
                float: left;
                width: 100%;
                min-height: 100%;
            }
            .userimg img[src='']{
                opacity: 0;
            }
            .user-text{
                width: 100%;
            }
            .user-title{
                width: 100%;
                margin-top: .2rem;
                font: 0.8rem /1rem "";
                color: #fff;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            .user-message{
                width: 100%;
                text-align: center;
                font: 600 0.45rem/2 "";
                background: linear-gradient(to top, #b56a24, #fedd57);
                background: -webkit-gradient(to top, #b56a24, #fedd57);
                -webkit-background-clip: text;
                -webkit-text-fill-color: transparent;
                i.st{
                    padding-left: .5rem;
                }
            }
            .grade{
                max-width: 48%;
                font-size: 0;
                
                text-align: center;
                color: #fcfaf8;
                background-color: #e74e9d;
                border-radius: 0.15rem;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                padding: 0 .2rem;
            }
            .user-p{
                font: 0.55rem/0.85rem "";
            }
            .articlecharm{
                display: inline-block;
                width: 60%;
                height: 0.5rem;
                border-radius: 10rem;
                vertical-align: middle;
                overflow: hidden;
                box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.41);
                border: solid 1px rgba(102, 102, 102, 0.5);
            }
            .articlecharm-em{
                display: block;
                width: 100%;
                height: 100%;
                background: url(../images/articlecharm-em.jpg) 0 0 ;
            }
            .user-text-sis{
                font:600 0.45rem/1.5"";
            }
            .gradient-text1{
                height: .8rem;
                font:600 0.5rem /1rem "";
            }
            .love-sis{
                display: inline-block;
                width: 1rem;
                height: 1rem;
                background: url(../images/love-sis.png) center no-repeat ;
                background-size:0.6rem auto;
                vertical-align: middle;
            }
        }
        .gradient{  
            display: inline-block;
            font-size: 60px;
            background: linear-gradient(to top, #b56a24, #fedd57);
            background: -webkit-gradient(to top, #b56a24, #fedd57);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }
        .content{
            .mui-scroll-wrapper{
                margin-top: 14.2rem;
            } 
            .content-top{
                display: -webkit-flex;
                align-items: center;
                height: 3.4rem;
                border-bottom: solid 0.5rem #f5f5f5;
            }
            .content-top a{
                width: 50%;
                height: 2rem;
            }
            .content-top a:last-child{
                border-left: solid 1px #ccc;
            }
            .content-top a span{
                display: block;
                width: 100%;
                font-size: 0.7rem;
                text-align: center;
                color: #d93b2a;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            .content-top a p{
                font-size: 0.6rem;
                text-align: center;
            }
            .matter{
                width: 100%;
                border-bottom: solid 0.5rem #f5f5f5;
                overflow: hidden;
            }
            .matter:last-child{
                border-bottom: 0;
            }
            .matter a{
                float: left;
                padding: 0.75rem 0.75rem  0.75rem 2.17rem;
                width: 100%;
                font: 0.7rem/1 "";
                color: #333;
            }
            .matter a span{
                float: right;
                color: #d93b2a;
            }
            .voice{
                background: url(../images/icon_my_03.png) 0.8rem 0.8rem no-repeat;
                background-size: .9rem auto;
                .voice-em{
                    float: left;
                    display: block;
                    width: 6.9rem;
                    height: 1.05rem;
                    background:url(../images/yuyin2.png) .5rem center #cccccc no-repeat;
                    background-size: 0.5rem auto;
                    border-radius: 21px;
                    color: #fff;
                    font: 0.6rem/ 1rem"";
                    padding-left: 1.2rem;
                }
            }
            .myfans{
                background: url(../images/myfans.png) 0.75rem 0.6rem no-repeat;
                background-size: .9rem auto;
            }
            .myattention{
                background: url(../images/myattention.png) 0.8rem 0.6rem no-repeat;
                background-size: .8rem auto;
            }
            .member{
                background: url(../images/icon_my_06.png) 0.7rem 0.5rem no-repeat;
                background-size: 1.05rem auto;
            }
            .approve{
                background: url(../images/icon_rz.png) 0.8rem 0.75rem no-repeat;
                background-size: 0.9rem auto;
            }
            .engagement-approve{
                background: url(../images/icon_yhrz.png) 0.8rem 0.58rem no-repeat;
                background-size: 0.9rem auto;
            }
            .engagement{
                background: url(../images/icon_my_01.png) 0.7rem 0.6rem no-repeat;
                background-size: 1rem auto;
            }
            .myprop{
                background: url(../images/myporp.png) 0.8rem 0.6rem no-repeat;
                background-size: .9rem auto;
            }
            .mytask{
                background: url(../images/mytask.png) 0.87rem 0.6rem no-repeat;
                background-size: .8rem auto;
            }
            .application{
                background: url(../images/icon_my_07.png) 0.7rem 0.6rem no-repeat;
                background-size: 0.95rem auto;
            }
            .administer{
                background: url(../images/icon_my_04.png) 0.7rem 0.6rem no-repeat;
                background-size: 1.05rem auto;
            }
            .convertcdk{
                background: url(../images/convertcdk.png) .8rem 0.6rem no-repeat;
                background-size: .9rem auto;    
            }
            .convert{
                background: url(../images/convert.png) 0.8rem 0.8rem no-repeat;
                background-size: .9rem auto;
            }
            .invite{
                background: url(../images/invite.png) 0.8rem 0.7rem no-repeat;
                background-size: .8rem auto;
            }
            .safety{
                background: url(../images/safety.png) 0.85rem 0.6rem no-repeat;
                background-size: .8rem auto;
            }
            .area,.mymanager,.myfrands{
                background: url(../images/icon_my_05.png) 0.7rem 0.55rem no-repeat;
                background-size: 1.05rem auto;
            }
            .myfrands,.myfans,.engagement,.myattention,.area,.administer{
                position: relative;
            }
            .myfrands i,.myfans i,.engagement i,.myattention i{
                width: .3rem;
                height: .3rem;
                background-color: #d93b2a;
                position: absolute;
                top: .5rem;
                left: 5.1rem;
                border-radius: 50%;
            }
            .administer i,.area i{
                width: .3rem;
                height: .3rem;
                background-color: #d93b2a;
                position: absolute;
                top: .5rem;
                left: 5.8rem;
                border-radius: 50%;
            }
            .shield{
                background: url(../images/icon_my_02.png) 0.7rem 0.55rem no-repeat;
                background-size: 1.05rem auto;
            }
            .matter-footer{    
                display: -webkit-flex;
                align-items: center;
                justify-content: center;
                width: 100%;
                text-align: center;
                float: left;
                border-top: solid 1px #e6e6e6;
            }
            .matter .exit,.matter .set{
                padding:0 1.25rem;
                width:auto;
                line-height: 2.25rem;
            }
            .exit{
                background: url(../images/icon_back.png) 0 center no-repeat;
                background-size: 1.05rem auto;
            }
            .set{
                background: url(../images/icon_set.png) 0 center no-repeat;
                background-size: 0.8rem auto;
            }
        }
    }
    
    .share-box{
        display: none;
        z-index: 100002;
        position: fixed;
        top: 50%;
        left: 50%;
        margin-left: -7.25rem;
        margin-top: -11.05rem;
        width: 14.5rem;
        height: 22.125rem;
        border-radius: .3rem;
        background-color: #fff;
    }
    .share-delect{
        position: absolute;
        top: -1.2rem;
        right: -1.2rem;
        display: block;
        width: 2.5rem;
        height: 2.5rem;
        background: url(../images/sharedelate.png) center no-repeat;
        background-size: 1.35rem auto;
    }
    .popover2{
        z-index: 100001;
    }
    .share-logo{
        height: 2.7rem;
        width: 2.7rem;
        background: url(../images/sharelogo.png)  .5rem center no-repeat rgba(255, 255, 255, 0.2);;
        background-size: 1.9rem auto;
    }
    .share-img{
        width: 100%;
        height: 15rem;
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        border-top-left-radius:.3rem ;
        border-top-right-radius:.3rem ;
    }
    .user-img{
        position: absolute;
        right: .5rem;
        top: -.3rem;
        width: 4rem;
        height: 4rem;
        .user-imgs{
            width: 100%;
            height: 100%;
        }
    }
    .share-text{
        position: relative;
        margin-top: .5rem;
        padding: 0 .75rem;
        width: 100%;
    }
    .lable{
        margin-top: .6rem;
        height: 1.5rem;
        background: url(../images/shear_text.png) center left no-repeat;
        background-size: contain;
    }
    .share-a{
        display: block;
        width: 5.75rem;
        height: 1.55rem;
        text-align: center;
        font: 0.7rem /1.55rem "";
        margin: .3rem auto 0 auto;
        background-color: #f24130;
        border-radius:5rem;
        box-shadow: -5px 8px 20px 0px rgba(0, 0, 0, 0.3);
        color: #fff;
    }
    .share-name,.share-id{
        font: 0.55rem/1.6 "";
        color: #333;
        height: 1rem;
    }
    .share-link{
        z-index: 100005;
        position: fixed;
        bottom: -5.2rem;
        left: 0;
        height: 5.125rem;
        width: 100%;
        background: #fff;
        text-align: center;
        font-size: 0;
        transition:bottom 300ms ease-out ;
        -webkit-transition:bottom 300ms ease-out ;
        .xian{
            display: inline-block;
            height: 2.5rem;
            width: 1px;
            background-color: #ccc;
        }
        .wechat,.Circle{
            display: inline-block;
            width: 45%;
            padding-top: 3rem;
            font: 0.75rem /1.5 "";
            color: #333;
        }
        .wechat{
            background: url(../images/icon_wx2.png) center no-repeat;
            background-size: 2rem auto;
        }
        .Circle{
            background: url(../images/icon_pyq2.png) center no-repeat;
            background-size: 1.625rem auto;
        }
    }
    /*******个人中心**end*/
    .poimit-table1{
        z-index: 999999;
        display: none;
        position: fixed;
        top: 50%;
        left: 10%;
        width: 80%;
        height: 22.2rem;
        background-color: rgba(0, 0, 0, 0.9);
        box-shadow: 0px 10px 26px 0px rgba(0, 0, 0, 0.38);
        border-radius: 0.5rem;
        opacity: .8;
        transform: translate(0,-50%);
        -webkit-transform: translate(0,-50%);
    }
    .promit{
        z-index: 999998;
    }
    .table-title{
        margin: 0 5%;
        text-align: center;
        font:0.8rem /2.6rem "";
        color: #fff;
        border-bottom: 1px solid #8f8f8f;
    }
    .table-text{
        padding: 0.95rem 5%;
        height: 19rem;
        overflow: hidden;
        overflow-y: scroll;
    }
    .table-text p{
        font:0.7rem /2 "";
        color: #fff;
    }
   
}   
/*******首页**end*/
/*******签到**start*/
.signin{
    .mui-content{
        background-color: #fff;
    }
    .mui-slider{
        height: 5.5rem;
        overflow: hidden;
    }
    .title,.title2{
        color: #333;
        font:  0.8rem/2rem "";
        padding-left: 2.075rem;
        background: url(../images/gif-red.png) 0.75rem center no-repeat;
        background-size: 0.85rem auto;
    }
    .title2{
        background: url(../images/guize-red.png) 0.75rem center no-repeat;
        background-size: 0.85rem auto;
    }
    .title-p{
        padding-left: 1.58rem;
        font: 0.7rem /2rem "";
        color: #808080;
    }
    .signin-box{
        display: -webkit-flex;
        justify-content: center;
        margin-top: 0.5rem;
        margin-bottom: 1.25rem;
    }
    .signin-a{
        display: block;
        width: 2.25rem;
        height: 2.5rem;
        background-color: #ccc;
        border-radius: 0.5rem;
        margin: 0 0.125rem;
        color: #fff;
        text-align: center;
        font-size: 0;
        span{
            display: inline-block;
            font: 0.65rem /1.5 "";
            padding-top: 0.3rem;
        }
        em{
            display:-webkit-flex;
            align-items: center;
            justify-content: center;
            width: 80%;
            margin-left: 10%;
            height: 1.25rem;
            font: 0.5rem /1.2 "";
            vertical-align: middle;
        }
    }
    .signin-a.active{
        background-color: #d93b2a;
    }
    .signintext{
        width: 84%;
        margin-left: 8%;
        p{
            font: 0.7rem /2.2 "";
            color: #808080;
        }
    }
}
/*******签到**end*/
/*******魅力等级**start*/
.grade{
    .main{
        margin-bottom: 2.5rem;
    }
    header.mui-bar{
        background-color: #fff;
    }
    .mui-content{
        background-color: #fff;
    }
    .grade-banner{
        width: 100%;
        height: 8.68rem;
        background: url(../images/geade_banner.jpg) 0 0 ;
        background-size: 100%;
        text-align: center;
    }
    .logo{
        position: relative;
        width: 100%;
        text-align: center;
        img{
            width: 6.45rem;
            height: 3.025rem;
            margin-top: 1.75rem;
        }
        .gradu_text{
            position: absolute;
            right: 50%;
            width: 1rem;
            text-align: center;
            bottom: .2rem;
            font:600 0.7rem/1.5 "";
        }
    }
    .gradient {
        display: inline-block;
        font-size: 60px;
        background: linear-gradient(to top, #b56a24, #fedd57);
        background: -webkit-gradient(to top, #b56a24, #fedd57);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }
    .gradient-text1,.gradient-text2{
        height: .8rem;
        font:600 0.5rem /1rem "";
    }
    .love-sis {
        display: inline-block;
        width: 1rem;
        height: 1rem;
        background: url(../images/love-sis.png) center no-repeat;
        background-size: 0.6rem auto;
        vertical-align: middle;
    }
    .articlecharm {
        display: inline-block;
        width: 60%;
        height: 0.5rem;
        border-radius: 10rem;
        vertical-align: middle;
        overflow: hidden;
        box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.41);
        border: solid 1px rgba(102, 102, 102, 0.5);
    }
    .articlecharm-em {
        display: block;
        height: 100%;
        background: url(../images/articlecharm-em.jpg) 0 0;
    }
    .user-text-sis {
        font: 600 0.45rem/1.5 "";
    }
    .title{
        color: #333;
        font: 0.8rem/2rem "";
        padding-left: 2.075rem;
        background: url(../images/icon_wenhao.png) 0.75rem center no-repeat;
        background-size: 0.85rem auto;
        margin-top: 0.5rem;
    }
    .zjml,.kcml{
        padding-top: .5rem;
        margin: 0 8%;
        color: #333;
        font: 0.75rem/2 "";
    }
    .zjml-text,.kcml-text{
        margin: 0 8%;
        color: #808080;
        font: 0.7rem/2 "";
    }
    .user-p{
        width: 84%;
        margin-left: 8%;
    }
}
/*******魅力等级**end*/
/*******临时账户**start*/
.notecase2 {
    .a-link{
        width: 100%;
        height: 3rem;
        margin: 0.75rem 0;
    }
    .link-left,.link-right{
        float: left;
        width: 50%;
        text-align: center;
    }
    .link-left{
        border-right: 1px solid #ccc;
        .link-left-span{
            color: #666;
            font: 0.8rem/1"";
        }
        .rou{
            display: block;
            margin: .7rem auto 0 auto;
            width: 3rem;
            background-color: #4c93ec;
            font: 0.5rem /0.8rem"";
            border-radius: 0.15rem;
            color: #fff;
        }
    }
    .link-right{
        .link-left-money{
            font: 0.9rem /1"";
            color: #d93b2a;
            margin-top: -.2rem;
        }
        .link-left-p{
            font: 0.6rem /1"";
            color: #666666;
            margin-top: 0.25rem;
        }
        .right-al{
            width: 100%;
            text-align: center;
        }
        .convert,.deposit{
            display: inline-block;
            width: 3rem;
            font: 0.5rem/0.9rem "";
            margin: 0 0.25rem;
            color: #fff;
            border-radius: 0.15rem;
            background-color: #e75d4e;
        }
    }
    .notecase .mui-content .mui-scroll-wrapper {
        padding-top: 18rem;
    }
    .notecase-balance{
        height: 11rem;
    }
    .poimit-table1{
        z-index: 999999;
        display: none;
        position: fixed;
        top: 50%;
        left: 10%;
        width: 80%;
        height: 22.2rem;
        background-color: rgba(0, 0, 0, 0.9);
        box-shadow: 0px 10px 26px 0px rgba(0, 0, 0, 0.38);
        border-radius: 0.5rem;
        opacity: .8;
        transform: translate(0,-50%);
        -webkit-transform: translate(0,-50%);
    }
    .promit{
        z-index: 999998;
    }
    .table-title{
        margin: 0 5%;
        text-align: center;
        font:0.8rem /2.6rem "";
        color: #fff;
        border-bottom: 1px solid #8f8f8f;
    }
    .table-text{
        margin: 0.95rem 5%;
        height: 18.1rem;
        overflow: hidden;
        overflow-y: scroll;
    }
    .table-text p{
        font:0.7rem /2 "";
        color: #fff;
    }
}
/*******临时账户**end*/
/*******兑换换币**start*/
.convert {
    header.header-color{
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .mui-content{
        background-color: #fff;
    }
    .rdntn{
        margin-top: 8.75rem;
        width: 80%;
        margin-left: 10%;
        height: 2rem;
        font-size: 0.9rem;
    }
    .useragrre{
        margin-top: 1.5rem;
        text-align: center;
        font: 0.6rem /1.5 "";
        .useragrre-p{
            color: #999;
        }
        .useragrre-a{
            color: #00aaff;
        }
        .useragrre-em{
            display: inline-block;
            width: 0.65rem;
            height: 0.65rem;
            background: url(../images/fangkuang.png) 0 0 no-repeat ;
            background-size: .65rem;
            margin:.05rem .3rem .1rem .3rem;
            vertical-align:middle ;
        }
    }
    .useragrre.active .useragrre-em{
        background: url(../images/fangkuang2.png) 0 0 no-repeat;
        background-size: .65rem;
    }
    em.money{
        display: inline-block;
        width: 2.5rem;
        height:  2.5rem;
        background: url(../images/icon_jb.png) center no-repeat ;
        background-size: 2rem auto;
        vertical-align: middle;
    }
    .notecase-box{
        border-top: 0.55rem solid #F5F5F5;
    }
    .notecase-balance {
        width: 100%;
        background-color: #fff;
        color: #d93b2a;
        padding-top: 1rem;
        position: relative;
        z-index: 10;
        .balance-title {
            text-align: center;
            font-size: 0.7rem;
            line-height: 0.7rem;
            color: #333;
        }
        .balance-num {
            height: 4.55rem;
            margin: 0.5rem 1rem 0 1rem;
            overflow: hidden;
            background: url(../images/balance-num-bg.png) center center no-repeat;
            background-size: contain;
            padding-top: 1rem;
            text-align: end;
            .balance {
                background: transparent;
                display: inline-block;
                border: 0;
                height: 2rem;
                flex: 1;
                -webkit-flex: 1;
                margin-left: 0.25rem;
                font-size: 0.8rem;
                line-height: 2rem;
                width: 65%;
                
            }
            .balance::-webkit-input-placeholder{
                color: #ccc;
                font-size: 0.8rem;
            }
        }
        .btns-recharge-withdraw {
            margin-top: 0.75rem;
            border-top: 1px solid #ccc;
            overflow: hidden;
            padding: 0.6rem 0;
            text-align: center;
            a {
                color: #333;
                font-size: 0.8rem;
                padding: 0.4rem 0;
            }
        }
        .notecase-text{
            width: 100%;
            text-align: center;
            color: #666;
            font: 0.6rem /1.9rem "";
            border-bottom: 1px solid #ccc;
        }
        .link-money{
            border-bottom: 1px solid #F5F5F5;
        }
        .link-money,.link-xun{
            position: relative;
            font: 0.7rem /2.2rem "";
            height: 2.2rem;
            padding: 0 .75rem;
        }
        .link-money em,.link-xun em{
            position: absolute;
            right: 0.75rem;
            top: 0;
            padding-right: 1rem;
        }
        .link-money em{
            background: url(../images/icon_jb.png) right 0 center no-repeat;
            background-size: 0.75rem auto;
        }
        .link-xun em{
            background: url(../images/icon_xun.png) right 0 center no-repeat;
            background-size: 0.75rem auto;
        }
    }
}
/*******兑换换币**end*/
/*******新的朋友**start*/
.newfriend{
    .fold{
        display: block;
    }
    .agree,.disagree,.look,.untieagree{
        display: inline-block;
        width: 2.82rem;
        margin-top: .4rem;
        color: #d93b2a;
        border: solid 1px #d93b2a;
        text-align: center;
        font-size: 0.7rem;
        line-height: 1rem;
        border: solid 1px #d93b2a;
        border-radius: 0.15rem;
    }
    .disagree{
        color: #999;
        border: solid 1px #999;
    }
    .text{
        position: absolute;
        top: 0;
        right: 0.75rem;
        width: 20%;
        text-align: end;
    }
    .text p{
        font:0.6rem /3.5rem "";
        color: #999;
    }
    .box{
        padding-left: .5rem;
    }
}
/*******新的朋友**end*/
/*******兑换商品**start*/
.redemption{
    .mui-content .mf-table-view-cell{
        position: relative;
        display: block;
        padding:  .55rem 0.75rem;
        height: auto;
    }
    .delete{
        position: absolute;
        right: 0;
        top: 25%;
        display: block;
        width: 2.375rem;
        height: 50%;
        background: url(../images/icon_delete.png) center no-repeat;
        background-size: 0.875rem auto;
    }
    .redemption-h3,.redemption-h4{
        font: 0.7rem/1.2rem "";
        color: #333;
        padding-right: 1.5rem;
        overflow: hidden;
    }
    .redemption-h5{
        padding-right:0;
    }
    .ads{
        display:  block;
        float:  right;
        color: #f00;
        border:  1px solid #f00;
        border-radius:  .3rem;
        font: 0.7rem/1.2rem ;
        padding: 0 .2rem;
    }
    .add .delete{
        margin-top: -.7rem;
    }
}
/*******兑换商品**end*/
/*******任务中心**start*/
.taskcenter{
    .mui-content{
        background-color: #fff;
    }
    header.mui-bar {
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .receive-box{
        width: 100%;
        border-bottom: 0.5rem solid #F5F5F5;
        .title{
            font: 0.9rem /1.5 "";
            color: #333;
            margin: 0.75rem;
        }
    }
    .content{
        li{
            position: relative;
            display: -webkit-flex;
            width: 100%;
            height: 3.5rem;
            border-bottom: 1px solid #E6E6E6;
            .img{
                width: 3.5rem;
                height: 100%;
                img{
                    width: 2rem;
                    height: auto;
                    margin: 0.75rem;
                }
            }
            .text{
                flex: 1;
                -webkit-flex: 1;
                padding: 0.75rem 0;
            }
            .text-p1{
                font: 0.7rem /1rem"";
                color: #333;
            }
            .text-p2{
                font: 0.5rem /1rem "";
                color: #666;
            }
        }
        li:last-child{
            border-bottom: 0;
        }
        .status{
            position: absolute;
            right: 0;
            top: 0;
            margin: 1.25rem 1.075rem;
            width: 3.25rem;
            height: 1.05rem;
            text-align: center;
            background-image: linear-gradient(-31deg, #e3857c 0%, #e87a6f 43%,  #ed6f62 100%), linear-gradient(#edd862,  #edd862);
            border-radius: 10rem;
            font: 0.5rem/1rem "";
            color: #fff;
        }
        .finish.status{
            background-image: linear-gradient(-31deg, #e9d043 0%, #ecc340 57%, #eeb53c 100%),linear-gradient(#edd862, #edd862);
        }
    }
}
/*******任务中心**end*/
/*******安全中心**start*/
.securitycenter{
    .mui-content{
        background-color: #fff;
    }
    header.mui-bar {
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    ul{
        border-bottom: 0.5rem solid #F5F5F5;
        li{
            height: 2.17rem;
            margin: 0 .75rem;
            border-bottom: 1px solid #E6E6E6;
            position: relative;
            font: 0.7rem /2.17rem "";
            color: #333;
        }
    }
    li:last-child{
        border-bottom: 0;
    }
    ul:last-child{
        border-bottom: 0;
        li:last-child{
            border-bottom: 1px solid #E6E6E6;
        }
    }
    i.mui-icon{
        position: absolute;
        right:-.8rem;
        top:0;
        padding: .7rem;
        font-size: 1rem;
        color: #999;  
    }
}    
/*******安全中心**end*/
/*******设置提现密码**start*/
.withdrawalspsd{
    header.mui-bar {
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .mui-content .main .getcode{
        border: 0;
        color: #f24130;
    }
}    
/*******设置提现密码**end*/
/*******设置密保问题**start*/
.security{
    .mui-content{
        background-color: #fff;
    }
    header.mui-bar {
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .mui-content .main .getcode{
        border: 0;
        color: #f24130;
    }
    .hand{
        padding: 0.75rem 0.9rem;
        height: 3.15rem;
        background-color: #F5F5F5;
        font: 0.7rem /0.9rem "";
        color: #999;
    }
    .question,.answer{
        display: block;
        position: relative;
        padding:0  0.75rem ;
        height: 2.17rem;
        border-bottom: 1px solid #E6E6E6;
        font: 0.7rem/2.17rem "";
        color: #333;
    }
    input{
        border: 0;
        padding-left: 1rem;
        background: transparent;
        width: 13.5rem;
        height: 100%;
    }
    .rdntn{
        height: 2rem;
        width: 80%;
        margin-left: 10%;
        margin-top: 9.73rem;
    }
    i.mui-icon{
        position: absolute;
        right:0;
        top:0;
        padding: .55rem;
        font-size: 1rem;
        color: #999;  
    }
    
}    
/*******设置密保问题**end*/
/*******设置**start*/
.set{
    .mui-content{
        background-color: #fff;
    }
    header.mui-bar{ 
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    ul.tab-box{
        border-bottom: 20px solid #F5F5F5;
        li{
            position: relative;
            margin: 0 .75rem;
            height: 2.13rem;
            border-bottom: 1px solid #E6E6E6;
            p{
                font: 0.7rem /2.13rem "";
                color: #333;
            }
            i.mui-icon{
                position: absolute;
                right: -.3rem;
                top: .5rem;
                color: #999;
            }
            .mui-switch{
                position: absolute;
                right: 0;
                top: .5rem;
            }
            .mui-switch-mini.mui-active .mui-switch-handle{
                transform: translate(.9rem,0);
                -webkit-transform: translate(.9rem,0);
            }
            .mui-switch.mui-active{
                border-color:#d93b2a;
                background-color: #d93b2a;
            }
            .mui-switch-mini{
                width: 1.9rem;
                height: 1rem;
            }
            .mui-switch{
                background-color: #ccc;
            }
            .mui-switch .mui-switch-handle{
                top: -0.05rem;
                left: 0; 
                width: 0.85rem;
                height: 0.85rem;
            }
        }
        li:last-child{
            border-bottom: 0;
        }
    }
    ul.tab-box:last-child{
        border-bottom: 0;
        li:last-child{
            border-bottom: 1px solid #E6E6E6;
        }
    }
    .editdata{
        .table-view-cell{
            width: auto;
            margin: 0 0.75rem;
            border-bottom: 1px solid #000;
            border-radius: 0;
        }
        .table-view-cell:last-child{
            border-bottom: 0;
        }
        .table-view-cell p{
            display: inline-block;
            color: #fff;
            padding-right: 0.88rem;
        }
        .table-view-cell input{
            width: 11rem;
            border: 0;
            background: transparent;
            color: #fff;
        }
        .table-view-cell input::-webkit-input-placeholder{color: #ccc;}
    }
    .title-sm{
        font: 0.6rem/1.25rem "";
        background-color: #F5F5F5;
        color: #999;
        padding-left: 0.75rem;
    }
}
/*******设置**end*/
/*******使用帮助**start*/
.help{
    h3.title{
        padding: 0 .75rem;
        font: 0.8rem /1.75rem "";
        background-color: #D9D9D9;
        color: #808080;
    }
    ul.tab-box li{
        margin: 0;
        padding: 0 .75rem;
    }
    ul.tab-box li i.mui-icon{
        right:.75rem;
    }
    .text{
        display: none;
        padding: 0.3rem 0.77rem;
        background-color: #F5F5F5;
        font: 0.7rem/1.7 "";
        .text-title{
            color: #4d4d4d;
            margin-left: -.2rem;
        }
    }
    .active.text{
        display: block;
    }
}
/*******使用帮助**end*/
/*******代理人管理**start*/
.pm{
    ul.tab-box .tab{
        margin: 0;
        padding: 0 .75rem;
    }
    span{
        color: #d93b2a;
    }
}
/*******代理人管理**end*/
/*******申请代理**start*/
.agency{
    ul.tab-box .tab{
        margin: 0;
        padding: 0 .75rem;
    }
    .agency-right{
        position: absolute;
        right: .75rem;
        top: 0;
        width: 70%;
        border: 0;
        background: transparent;
        text-align: end;
        font-size: 0.7rem;
        color: #333;
    }
    .agency-right::-webkit-input-placeholder{
        color: #999;
    }
    .rdntn{
        width:80%;
        height: 2rem;
        margin: 15rem 10% 0 10%;
    }
}
/*******申请代理**end*/
/*******我的道具**start*/
.myprop{
    .con-action{
        overflow: hidden;
    }
    .mui-scroll-wrapper{
        display: none;
    }
    .active.mui-scroll-wrapper{
        display: block;
    }
    .color{
        color: #d93b2a;
    }
    .mui-bar-nav ~ .mui-content > .mui-scroll-wrapper,.mui-bar-nav ~ .mui-content{
        padding-top: 4.7rem;
    }
    .appointment .mui-bar-nav ~ .mui-content > .mui-scroll-wrapper{
        padding-top: 4.7rem;
    }
    .mui-content{
        background-color: #fff;
    }
    header.mui-bar {
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .con-title{
        z-index: 3;
        position: absolute;
        top:2.2rem;
        left: 0;
        width: 100%;
        display: -webkit-flex;
        background-color: #fff;
        justify-content: center;
        border-bottom: 0.5rem solid #F5F5F5;
        .link-a{
            flex: 1;
            -webkit-flex: 1;
            display: inline-block;
            height: 2rem;
            border-bottom: 1px solid #fff;
            text-align: center;
            font: 0.8rem /2rem "";
            color: #333;
        }
        .active.link-a{
            border-color: #d93b2a;
            color: #d93b2a;
        }
    }
    .con{
        padding: 0 4%;
        font-size: 0;
        border-bottom: 0.5rem solid #F5F5F5;
    }
    .chip{
        display: inline-block; 
        width: 25%;
        text-align: center;
        margin: 0.8rem 0;
        img{
            height: 1.9rem;
        }
        .chip-sub{
            font: 0.55rem/1.5 "";
            color: #333;
        }
        .chip-money{
            font: 0.5rem /1.7"";
            color: #666;
        }
    }
    .nochip{
        line-height: 3rem;
        color: #ccc;
        font-size: .9rem;
    }
    .con-action{
        .title{
            font: 0.8rem/2.25rem "";
            color: #333;
            margin-left: 0.75rem;
        }
        .search{
            margin-left: 0.75rem;
            height: 1.1rem;
            width: 13.15rem;
            padding-left: 1.25rem;
            font-size: 0.7rem;
            border: 1px solid #ccc;
            border-radius: .3rem;
            background: url(../images/icon_serch2.png) 0.25rem center no-repeat transparent;
            background-size: 0.75rem auto;
            color: #333;
        }
        .search::-webkit-input-placeholder{color: #ccc;}
        .prop{
            position: relative;
            display: inline-block;
            width: 9rem;
            padding-left: 0.75rem;
            float: left;
            .prop-img{
                width: 8.25rem;
                height: 5rem;
                margin:0.75rem 0;
                text-align: center;
                line-height:  4.7rem;
                img{
                    max-height: 5rem;
                    max-width: 8.25rem;
                    vertical-align: middle;
                }
            }
            .prop-name{
                font: 0.75rem /1.5 "";
                color: #333;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                word-wrap: break-word;
                min-height: 2.2rem;
            }
            .prop-nub{
                font: 0.7rem /1.8"";
                color: #999;
                span.color{
                    color: #c40e18;
                }
            }
            .btn{
                position: absolute;
                right: 0;
                bottom: 0.3rem;
                display: inline-block;
                width: 3.25rem ;
                text-align: center;
                border-radius: .15rem;
                font: 0.7rem /1.25rem "";
                color: #fff;
                background-color: #d93b2a;
            }
        }
    }
    .hint{
        font: 0.7rem /2.2rem "";
        color: #333;
        padding:0 .5rem ;
        margin-bottom: 0.25rem;
        margin-top:-.5rem;
        background-color: #F5F5F5;
    }
    .card{
        margin: .5rem;
        padding-bottom: .5rem;
        box-shadow: 0px 6px 20px 0px  rgba(0, 0, 0, 0.1);
        border-radius: 0.25rem;
        .card-title{
            padding-left: 0.83rem;
            margin-bottom: .5rem;
            height: 2.2rem;
            border-bottom: 1px solid #E6E6E6;
            clear: both;
            font: 0.8rem /2.2rem "";
            color: #333;
            .color{
                font: 0.7rem/2.2rem "";
                float: right;
                padding-right: 0.5rem;
            }
        }
    }
    .lose.color{
        color: #999;
    }
    .card-text{
        padding: 0 0.85rem;
        font: 0.7rem /2 "";
        color: #666;
    }
    .cards{
        .card-title{
            clear: both;
            padding: 0 0.75rem;
            height: 2.15rem;
            font: 0.7rem/2.15rem "";
            color: #333;
            border-bottom: 1px solid #E6E6E6;
            span{
                padding-left:1.2rem;
                float: right;
                color: #666;
            }
        }
        .card-title.yhk span{
            background: url(../images/icon_yhk.png) .05rem center no-repeat;
            background-size: 0.88rem auto;
        }
        .card-title.hyk span{
            background: url(../images/icon_hyk.png) .1rem center no-repeat;
            background-size: 0.83rem auto;
        }
        .card-title.bqk span{
            background: url(../images/icon_bqk.png) .15rem center no-repeat;
            background-size: 0.75rem auto;
        }
    }
    .gift-con{
        p.con-gift{
            position: relative;
            font: 0.7rem/2.15rem "";
            color: #333;
            padding: 0 .75rem;
        }
        a.con-gift-a{
            position: absolute;
            right: 0;
            top: 0;
            font-size: 1.2rem;
            padding: 0.39rem 0.75rem;
            color: #999;
        }
        .con-gift-p{
            font-size: 0;
        }
        .giftimg-div{
            display: flex;
            display: -webkit-flex;
            justify-content: center;
            align-items: center;
            font: 0.55rem/1.5 "";
            width: 100%;
            color: #333;
            height: 2rem;
            margin-bottom: .15rem;
        }
        .gift{
            display: inline-block;
            width: 25%;
            height: 2.975rem;
            text-align: center;
            border-radius: 0.38rem;
            line-height: 0;
            margin-top: 0.5rem;
            .giftimg{
                max-height: 2rem;
                max-width: 50%;
                vertical-align: middle;
            }
            em{
                width: 100%;
                color: #666;
                font: 0.5rem / 1.5 "";
            }
            span.text{
                display: block;
               font:0.55rem/ 1.5 ""; 
               width: 100%;
               color: #333;
            }
        }
    }
}
/*******我的道具**end*/
/*******我的收货地址**start*/
.site{
    header.mui-bar {
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .mui-content{
        background-color: #fff;
    }
    .con{
        border-bottom: 0.5rem solid #F5F5F5;
        p{
            clear: both;
            padding:0 0.75rem;
            font: 0.7rem /1.4 "";
            color: #333;
        }
        .sex{
            padding-left: .8rem;
        }
        .phone{
            float: right;
        }
        p.inf{
            padding-top: .8rem;
        }
        p.site{
            padding: 0.5rem 0.75rem;
        }
        p.lable{
            clear: both;
            height: 2.125rem;
            border-top: 1px solid #F2F2F2;
        }
        .editdata,a.lable,.delete{
            display: inline-block;
            font: 0.7rem/2.125rem "";
            color: #333;
        }
        .editdata,.delete{
            float: right;
            padding-left: 1.67rem;
        }
        a.lable{
            padding-left: 0.925rem;
            background: url(../images/seit_fk1.png)0 center no-repeat;
            background-size: 0.6rem auto;
        }
        a.lable.active{
            background: url(../images/seit_fk2.png)0 center no-repeat;
            background-size: 0.6rem auto;
        }
        .editdata{
            background: url(../images/icon_editdata.png) 0.75rem center no-repeat;
            background-size: 0.65rem auto;
        }
        .delete{
            background: url(../images/icon_delete3.png) 0.75rem center no-repeat;
            background-size: 0.65rem auto;
        }
    }
    .add-seit{
        padding-left: 2.8rem;
        font:600 0.75rem /3.125rem "";
        color: #999;
        background: url(../images/jx_jia.png) 0.58rem center no-repeat;
        background-size: 1.6rem auto;
        margin-bottom: 2.25rem;
    }
    .footer{
        z-index: 999;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 2.25rem;
        text-align: center;
        font: 0.9rem /2.25rem "";
        color: #fff;
        background-color: #d93b2a;
    }
}
/*******我的收货地址**end*/
/*******新增收货地址**start*/
.addsite{
    header.mui-bar {
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .mui-content{
        background-color: #fff;
    }
    .con-p{
        display: flex;
        display: -webkit-flex;
        margin: 0 .38rem;
        height: 2.18rem;
        border-bottom: 1px solid #E5E5E5;
        span{
            padding-left: 0.5rem;
            width: 4.2rem;
            font: 0.7rem /2.18rem"";
            color: #333;
        }
        input{
            flex: 1;
            -webkit-flex: 1;
            border: 0;
            height: 100%;
            background: transparent;
            color: #333;
            font-size: 0.7rem;
        }
        input::-webkit-input-placeholder{color: #ccc;}
        .sex{
            padding-left: 0.875rem;
            padding-right: 1.5rem;
            font: 0.7rem/2.18rem "";
            color: #333;
            background: url(../images/fangkuang0.png) 0 center no-repeat;
            background-size: 0.6rem auto;
        }
        .active.sex{
            background: url(../images/fangkuang2.png) 0 center no-repeat;
            background-size: 0.6rem auto;
        }
    }
    .rdntn{
        margin:2.5rem 10% 0 10%;
        width: 80%;
        height: 2rem;
        font: 0.9rem/2rem "";
    }
}
/*******新增收货地址**end*/
/*******申请经理人**start*/
.handler{
    .register{
        padding: 2rem;
        overflow: hidden;
        clear: both;
    }
    ul.tab-box .tab{
        margin: 0;
        padding: 0 .75rem;
    }
    .agency-right{
        position: absolute;
        right: .75rem;
        top: 0;
        width: 70%;
        border: 0;
        background: transparent;
        text-align: end;
        font-size: 0.7rem;
        color: #333;
    }
    .agency-right::-webkit-input-placeholder{
        color: #999;
    }
    .rdntn{
        width:100%;
        height: 2rem;
    }
}
/*******申请经理人**end*/
/*******经理人管理**start*/
.handlersharp{
    .date-unbund-list,.lose-team,.new-team,.appnew{
        display: none;
    }
    .newfriend-text{
        display: none;
    }
    .view3-p{
        padding: .5rem 1rem 0 1rem;
        font: 0.5rem/1.2 "";
        color: #ccc;
        opacity: .8;
    }
    .mui-bar-nav ~ .mui-content > .mui-scroll-wrapper,.mui-bar-nav ~ .mui-content{
        padding-top: 6.85rem;
    }
    .appointment .mui-bar-nav ~ .mui-content > .mui-scroll-wrapper{
        padding-top: 6.85rem;
    }
    .mui-content{
        background-color: #fff;
    }
    header.mui-bar {
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .color{
        color: #d93b2a;
    }
    .con-title{
        z-index: 3;
        position: absolute;
        top:2.2rem;
        left: 0;
        width: 100%;
        background-color: #fff;
        justify-content: center;
        border-bottom: 0.5rem solid #F5F5F5;
        .title{
            padding: 0 .75rem;
            height: 2.15rem;
            font: 0.7rem /2.15rem "";
            color: #333;
            background-color: #F2F2F2;
            span{
                float: right;
            }
        }
        .link{
            text-align: center;
        }
        .link-a{
            position: relative;
            clear: both;
            margin: 0 .44rem;
            display: inline-block;
            height: 2rem;
            text-align: center;
            font: 0.8rem /2rem "";
            color: #333;
            p.p{
                display: none;
                position: absolute;
                left: 50%;
                bottom: 0;
                margin-left: -1.96rem;
                width: 3.92rem;
                height: 0.15rem;
                background-color: #d93b2a;
            }
        }
        .active.link-a{
            border-color: #d93b2a;
            color: #d93b2a;
            p.p{
                display: block;
            }
        }
    }
    .newfriend .title{
        width: 100%;
        padding-left:  .75rem;
        font: 0.8rem/2.25rem "";
        color: #333;
        height: 2.25rem;
        background-color: #fff;
        span{
            padding-left: .5rem;
            font: 0.55rem/2.25rem "";
        }
        .mui-icon{
            float: right;
            padding: .55rem;
            color: #999;
        }
    }
    .newfriend{
        border-bottom: 0.5rem solid #F5F5F5;
        .fold-text{
            width: 100%;
        }
    }
    .lia{
        position: absolute;
        right: .75rem;
        top: 1.2rem;
        display: inline-block;
        padding: 0 .66rem;
        color: #d93b2a;
        text-align: center;
        font-size: 0.7rem;
        line-height: 1rem;
        border: solid 1px #d93b2a;
        border-radius: 0.15rem;
    }
    .untie{
        font-size: 0.6rem;
        padding: 0 .6rem;
    }
    .con .fold-text{
        border-top: 0;
        border-bottom: solid 1px #e6e6e6;
    }
    .mui-scroll-wrapper{
        display: none;
    }
    .active.mui-scroll-wrapper{
        display: block;
    }
    .myprop .con{
        border-bottom:0;
    }
}
/*******经理人管理**end*/

/*******系统消息**start*/
.messages{
    .mui-bar-nav ~ .mui-content{
        overflow: scroll;
    }
    .main{
        padding-top: 0.75rem;
    }
    header.mui-bar {
        z-index: 99999;
        background-color: #ffffff;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    }
    .time-box{
        text-align: center;
    }
    .time{
        max-width: 15rem;
        display: inline-block;
        margin-bottom: .75rem;
        padding: .2rem .45rem 0.2rem .45rem;
        background-color: rgba(0, 0, 0, 0.08);
        color: #fff;
        font: 0.6rem /1.5 "";
        border-radius: .15rem;
    }
    .chat-box{
        padding: 0 .5rem  .75rem .5rem;
        font-size: 0;
        overflow: hidden;
        .face-bq{
            margin: 0 .2rem;
            width: 1.25rem;
            height: auto;
            vertical-align: middle;
        }
        .text p,.text div{
            min-height: 1.2rem;
            word-wrap: break-word;
        }
    }
    .user{
        width: 2.25rem;
        height: 2.25rem;
        border-radius: 50%;
        vertical-align:top;
    }
    .text-box{
        display: inline-block;
    }
    .text,.video-box,.card-box{
        position: relative;
        display: inline-block;
        margin: 0 .75rem;
        max-width: 12.77rem;
        padding:0.625rem 0.75rem ;
        font: 0.8rem /1.5"";
        border-radius: 0.4rem;
    }
    .em{
        position: absolute;
        top: 0.65rem;
        width: 0.7rem;
        height: 0.85rem;
    }
    .chat-left {
        .text,.video-box,.card-box{
            background-color: #fff;
        }
        .text p,.text div{
            color: #333;
        }
        .em{
            left: -.5rem;
            background: url(../images/icon_jiao1.png) no-repeat 0 0;
            background-size: 0.7rem auto;
        }
    }
    .chat-right {
        .text-box{
            float: right;
        }
        .text,.video-box,.card-box{
            background-color: #f3671b;
        }
        .text p,.text div{
            color: #fff;
        }
        .em{
            right: -.5rem;
            background: url(../images/icon_jiao2.png) no-repeat 0 0;
            background-size: 0.7rem auto;
        }
        .user{
            float: right;
        }
    }
    .username{
        padding-left: 0.9rem;
        padding-bottom: 0.2rem;
        font: 0.5rem/1.5 "";
        color: #999;
    }
}
/*******系统消息**end*/

/*******手机通讯录**start*/
.telephone{
    nav.nav a,.top,.bottom{
        height: 3.2%;
    }
    .clickbox{
        background: url(../images/fangkuang0.png) center no-repeat;
        background-size: 0.7rem auto;
    }
    .active .clickbox{
        background: url(../images/juxing2.png) center no-repeat;
        background-size: 0.7rem auto;
    }
    .mui-content{
        position: relative;
    }
    .footer{
        z-index: 99;
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 2.25rem;
        background-color: #fff;
        border-top: 1px solid #E6E6E6;
        overflow: hidden;
    }
    .ft-left{
        float: left;
        height: 100%;
        font: 0.7rem/2.25rem "";
        color: #333;
        .clickbox{
            background-position: 0.75rem center;
            padding-left: 1.95rem;
        }
    }
    .ft-right{
        float: right;
        width: 6.5rem;
        height: 2.25rem;
        font: 0.9rem/2.25rem "";
        color: #fff;
        text-align: center;
        background-color: #d93b2a;
    }
}
/*******手机通讯录**end*/

/*******聊天**start*/
.chat,.circlefriends{
    position: relative;
    .voice-lading{
        background-position: center;
    }
    .mui-title{
        .title-box{
            position: relative;
            left: 50%;
            width: 3.2rem;
            height: 2.2rem;
            transform: translateX(-50%);
            -webkit-transform: translateX(-50%);
        }
        .title-left{
            position: absolute;
            top: .6rem;
            left: 0;
            z-index: 20;
            width: 1.7rem;
            height: 1.4rem;
            .title-em{
                position: absolute;
                left: 0rem;
                top: 0rem;
                z-index: 90;
                display: block;
                width: 100%;
                height: 100%;
                margin-top:.1rem;
                background: url(../images/chat_oleft.png) 0 0 no-repeat;
                background-size: 100%;
            }
            img{
                width: 1.5rem;
                height: 100%;
                border: 2px solid #fff;
                border-bottom-right-radius:50% ;
                border-bottom-left-radius:50% ;
                border-top-right-radius:50%;
            }
        }
        .title-right{
            position: absolute;
            top: .1rem;
            right: 0;
            z-index: 10;
            width: 2.2rem;
            height: 2.2rem;
            .title-em{
                position: absolute;
                left: 0;
                top: 0;
                z-index: 90;
                display: block;
                width: 100%;
                height: 100%;
                background: url(../images/chat_oright.png) 0 0 no-repeat;
                background-size: 100%;
            }
            img{
                padding: .1rem;
                width: 2.2rem;
                height: 2rem;
            }
        }
    }
    .mui-slider{
        height: 100%;
        display: none;
    }
    .active.mui-slider{
        display: block;
    }
    .mui-content{
        background-color: #EEEEEE;
        padding-bottom: 2.5rem;
    }
    .main{
        height: 100%;
        overflow-y: scroll;
    }
    .main::-webkit-scrollbar{display: none;}
    .complain,.chat-love,.chat-addfrand{
        z-index: 99;
        position: absolute;
        top: 0;
    }
    .chat-love,.chat-addfrand{
        right: 0;
        width: 2rem;
        height: 100%;
        background:url(../images/chat_love.png)0 center no-repeat;
        background-size: 1.075rem auto;
    }
    .complain{
        right: 2rem;
        width: 2rem;
        height: 100%;
        background: url(../images/chat_ts.png) center no-repeat;
        background-size: 0.775rem auto;
    }
    .chat-addfrand{
        background: url(../images/chat_addfrande.png) 0 .6rem no-repeat;
        background-size: 1rem auto;
    }
    .chat-card{
        text-align: center;
        margin-bottom: 1rem;
        margin-top: 0.25rem;
        .card{
            display: inline-block;
            padding: 0.8rem 0;
            background-color: #fff;
            border-radius: .5rem;
            width: 12rem;
        }
        p{
            font: 0.7rem /1.5 "";
            color: #333;
        }
        span{
            font: 0.6rem/1.5"";
            color: #666;
        }
        div{
            display: inline-block;
        }
        .card-text{
            margin-left: 0.75rem;
            margin-top: 1rem;
            text-align: start;
        }
        .card-con{
            margin-top: 1rem;
            margin-bottom: .5rem;
            img{
                vertical-align: top;
                max-width: 4rem;
                max-height: 4rem;
            }
        }
    }
    .footer{
        z-index: 999;
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        background-color: #F5F5F5;
        font-size: 0;
        transition: height 350ms; 
        -webkit-transition: height 350ms; 
        .menu .menu-box{
            display: none;
            float: left;
            width: 100%;
            border-top: 2px solid #EBEBEB;
            overflow: hidden;
        }
        .menu-box{
            height: 12.5rem!important;
        }
        .menu-link{
            float: left;
//          height: 2.5rem;
            width: 100%;
        }
        .add{
            display: none;
            .box{
                float: left;
                width: 3rem;
                height: 4rem;
                margin-left: 1.375rem;
                margin-top: 1.75rem;
            }
            .chip-linkbox,.gift-linkbox,.reserve-linkbox{
                display: none;
            }
        }
        .link{
            display: inline-block;
            width: 2.9rem;
            height: 2.9rem;
            border: 1px solid #ccc;
            border-radius: 0.5rem;
            background-color: #fbfbfb;
            background-position: center;
            background-repeat: no-repeat;
        }
        .phot{
            background-image: url(../images/chat_pht.png);
            background-size: 1.5rem auto;
        }
        .void{
            background-image: url(../images/chat_vdio.png);
            background-size: 1.45rem auto;
        }
        .gift{
            background-image: url(../images/chat_gift.png);
            background-size: 1.45rem auto;
        }
        .chip{
            background-image: url(../images/chat_chip.png);
            background-size: 1.15rem auto;
        }
        .card{
            background-image: url(../images/chat_card.png);
            background-size: 1.45rem auto;
        }
        .reserve{
            background-image: url(../images/chat_reserve.png);
            background-size: 1.45rem auto;
        }
        p.p{
            text-align: center;
            font: 0.6rem/2 "";
            color: #666;
        }
        .mui-slider-item{
            font-size: 0;
        }
        .menu-face{
            position: relative;
            width: 100%;
            height: 100%;
            padding-bottom: 2.25rem;
            a{
                float: left;
                width: 2.5rem;
                height: 3rem;
                overflow: hidden;
            }
            .face-img ,.face-add{
                float: left;
                margin-top: 1.5rem;
                width: 2.625rem;
                height: 2.625rem;
                text-align: center;
                img{
                    max-width: 2.625rem;
                    max-height: 2.625rem;
                    vertical-align: -webkit-baseline-middle;
                    vertical-align: middle;
                    width: auto;
                    height: auto;
                }
            }
            .face-bq{
                margin-top: 1.5rem;
                margin-left: 1rem;
                margin-right: 0.25rem;
                max-width: 1.25rem;
                text-align: center;
                max-height: 1.5rem;
                vertical-align: middle;
            }
            .face-add{
                float: left;
                margin-left: 0.75rem;
                vertical-align: middle;
            }
            .face-img{
                margin-left: 1rem;
            }
            .face-bot{
                z-index: 999;
                position: absolute;
                left: 0;
                bottom: 0;
                width: 100%;
                height: 2.25rem;
                background-color: #ededed;
            }
            .face-bot-bq{
                display: inline-block;
                width: 3.125rem;
                height: 100%;
                background: url(../images/face-botbq.png) center no-repeat;
                background-size: 1.35rem auto;
            }
            .face-bot-love{
                display: inline-block;
                width: 3.125rem;
                height: 100%;
                background: url(../images/face-botlove.png) center no-repeat;
                background-size: 1.35rem auto;
            }
            .face-bot-color{
                background-color: #e0e0e0;
            }
        }
    }
    .chat-val-box{
        border-bottom: 1px solid #808080;
        margin: .4rem  0.5rem .6rem .5rem ;
        overflow-y: scroll;
        min-height:1.5rem ;
        max-height: 3rem;
        float: left;
        width: 10rem;
        padding-top: .2rem;
    }
    .chat-val{
        color: #333;
        -moz-user-select: text; 
        -webkit-user-select: text;
        font:.7rem/1.5 "" ;
        div{
            float: left;
            font:.7rem/1.5 "" ;
            color: #333;
            margin: 0;
            padding: 0;
        }
        .face-bq{
            width: 1.25rem;
            margin: 0 .2rem;
            height: auto;
            vertical-align: middle;
        }
    }
    .chat-val::-webkit-scrollbar{display: none;}
    .voice,.face,.rests,.bth,.keyboard{
        float: left;
        width: 1.75rem;
        height: 2.5rem;
    }
    .face{
        margin-right:  0.4rem;
        background: url(../images/chat_bq.png) center no-repeat;
        background-size: 1.7rem auto;
    }
    .voice{
        margin-left: .625rem;
        background: url(../images/chat_yy2.png) center no-repeat;
        background-size: 1.7rem auto;
    }
    .rests{
        margin-left: .3rem;
        background: url(../images/chat_jia0.png)center no-repeat;
        background-size: 1.7rem auto;
    }
    .keyboard{
        background: url(../images/chat_jp.png) center no-repeat;
        background-size: 1.7rem auto;
    }
    .bth{
        display: none;
        width: 2.3rem;
        height: 1.5rem;
        margin-top: 0.5rem;
        margin-bottom: 0.5rem;
        background-color: #d93b2a;
        color: #fff;
        font: 0.6rem /1.4rem "";
        border-radius: .3rem;
        text-align: center;
    }
    .chat-box .video-box{
        max-width: 10rem;
        min-width: 3rem;
        height: 2rem;
    }
    .chat-box .video-box .vidos{
        margin-top: -.2rem;
        width: 0.75rem;
        height: auto;
    }
    .chat-right .video-box-p p{
        margin-top: -.25rem;
        color: #fff;
        margin-right: 1.2rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .chat-left .video-box-p p{
        margin-top: -1.5rem;
        color: #000000;
        margin-left: 1.2rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .chat-right .video-box .vidos{
        float: right;
    }
    .chat-box .video-box .second{
        position: absolute;
        top: 0;
        color: #666;
        font: 0.7rem/2rem "";
    }
    .chat-right .video-box .second{
        left: -1.5rem;
    }
    .chat-left .video-box .second{
        right: -1.7rem;
    }
    .mui-table-view-cell a{
        display: inline-block;
        width: 2.75rem;
        height: 2rem;
        border-left: 1px solid #1A1A1A;
        border-radius:unset!important;
        color: #fff!important;
        text-align: center;
    }
    .mui-table-view-cell{
        background-color: transparent;
        opacity: 0.75;
        color: #fff;
    }
    .mui-popover .mui-popover-arrow:after{
        background-color: #3f3939;
    }
    .mui-popover .mui-table-view{
        background-color: transparent;
    }
    .mui-popover{
        width: 8.3rem;
        height: 2rem;
        background-color: rgba(0, 0, 0, 0.75);
        box-shadow: 0px 10px 26px 0px rgba(0, 0, 0, 0.38);
    }
    .mui-popover .mui-scroll-wrapper{
        margin: 0;
    }
    .gift-box{
        bottom: -100%;
        left: 0;
        transition: bottom 400ms;
        -webkit-transition: bottom 400ms;
    }
    .chip-box{
        bottom: 0;
        left: 100%;
        transition: left 400ms;
        -webkit-transition: left 400ms;
    }
    .gift-box,.chip-box{
        display: none;
        z-index: 1000;
        position:fixed;
        position:-ms-device-fixed;
        width: 100%;
        background-color: rgba(0, 0, 0, 0.75);
        .box-title{
            position: relative;
            height: 2.5rem;
            width: 100%;
            border-bottom: 1px solid #4D4D4D ;
        }
        .box-roll{
            height: 100%;
            width: 100%;
            overflow: hidden;
        }
        .box-title p{
            text-align: center;
            font: 0.8rem /2.5rem "";
            color: #fff;
        }
        .box-bot{
            width: 100%;
            height: 2.25rem;
            background-color: #494949;
            font-size: 0;
        }
        .close{
            position: absolute;
            right: 0;
            top: 0;
            display: block;
            width: 2.25rem;
            height: 100%;
            background: url(../images/chat_close.png) center no-repeat;
            background-size: 0.7rem auto;
        }
        .box-text{
            height: 10.8rem;
            width: 100%;
            font-size: 0;
            overflow: hidden;
        }
        .box-roll::-webkit-scrollbar{display: none;}
        .img-p{
            text-align: center;
            display: inline-block;
            height: 2.25rem;
            width: 2rem;
            line-height: 2rem;
        }
        .gift-a{
            border-radius: .5rem;
            display: inline-block;
            width: 4.5rem;
            height: 5.3rem;
            text-align: center;
            padding-top: .7rem;
            img{
                width: auto;
                height: auto;
                max-height: 100%;
                max-width: 100%;
                vertical-align: middle;
            }
            .gift-name{
                color: #fff;
                font: 0.55rem /1.5 "";
            }
            .gift-nub{
                color: #ccc;
                font: 0.5rem /1.5 "";
            }
        }
        .active.gift-a{
            background-image: linear-gradient(0deg,rgba(132, 132, 132, 0.2) 0%, rgba(232, 232, 232, 0.2) 100%), linear-gradient(rgba(255, 255, 255, 0.2),rgba(255, 255, 255, 0.2));
            background-blend-mode: normal, normal;
        }
        .gift-link,.gift-chip{
            float: left;
            display: inline-block;
            width: 3.1rem;
            height: 100%;
        }
        .gift-link{
            background: url(../images/chat_gift2.png) center no-repeat;
            background-size: 1.35rem auto;
        }
        .gift-chip{
            background: url(../images/chat_clip.png) center no-repeat;
            background-size: 1.3rem auto;
        }
        .gift-link-color{
            background-color: #5e5e5e;
        }
        .btn{
            float: right;
            margin: 0.275rem 0.35rem;
            display: inline-block;
            width: 2.3rem ;
            height: 1.7rem;
            background-color: #d93b2a;
            font: 0.75rem /1.7rem "";
            border-radius: .3rem;
            text-align: center;
            color: #fff;
        }
        .nub-box{
            float: left;
        }
        .nub-span{
            float: left;
            font: 0.7rem /2.25rem "";
            color: #fff;
            width: 4.55rem;
            text-align: center;
        }
        .nub{
            float: left;
            margin-top: 0.5rem;
            text-align: center;
            display: block
            height: 1.3rem;
            width: 1.75rem;
            font: 0.7rem /1.3rem "";
            color: #FFFFFF;
            background-color: transparent;
            border: 0;
            height: 100%;
        }
        .nub-jian ,.nub-jia{
            display: inline-block;
            float: left;
            margin: 0.5rem 0;
            width: 1.3rem;
            height: 1.15rem;
            background: url(../images/chat_jian.png) no-repeat center;
            background-size: 100%;
        }
        .nub-jia{
            background-image: url(../images/chat_jia.png);
        }
    }
    .gift-box.active{
        bottom: 0;
    }
    .chip-box.active{
        left: 0;
    }
    .card-box{
        position: relative;
        width: 11.25rem;
        height: 6.375rem;
        border-radius: .3rem;
        font-size: 0;
        img{
            position: absolute;
            left: 0.7rem;
            bottom: 1.05rem;
            float: left;
            width: 2.5rem;
            height: 2.5rem;
            border-radius: 50%;
        }
        .card-p{
            font: 0.8rem/1.5 "";
            color: #999;
            padding-bottom: 0.35rem;
            border-bottom: 1px solid #E6E6E6;
        }
        .name,.id{
            display: inline-block;
            margin-left: 3rem;
        }
        .name{
            margin-top: .5rem;
            font: 0.8rem/1.5rem'';
            color: #333;
        }
        .id{
            font: 0.6rem/1.5rem "";
            color: #999;
        }
    }
    .chat-right .card-box{
        .id,.card-p{
            color: #E6E6E6;
        }
        .name{
            color: #fff;
        }
    }
    .vdo-left,.vdo-right{
        display: inline-block;
        padding: 0 2.25rem;
        height: 2.5rem;
        width: 50%;
        font: 0.7rem/2.5rem "";
        color: #333;
    }
    .vdo-right{
        text-align: end;
    }
    .vdo-color{
        color: #d93b2a;
    }
    .vdo-text{
        width: 100%;
        height: 10rem;
    }
    .vdo-box{
        text-align: center;
        
    }
    .vdo{
        .mui-slider-item{
            height: 10rem;
        }
        .mui-slider-indicator{
            bottom: 1rem;
        }
    }
    .vdo-a{
        display: inline-block;
        margin-top: 2.5rem;
        width: 4.45rem;
        height: 4.45rem;
        background: url(../images/icon_yuying.png) center no-repeat;
        background-size: 100%;
    }
    .vdos{
        display: none;
        .vdos-a{
            float: left;
            margin: 0  0 .5rem .6rem;
            display: inline-block;
            width: 8.425rem;
            height: 1.25rem;
            padding-left: 1.25rem;
            padding-top: .55rem;
            border: 1px solid #ff0000;
            border-radius: .3rem;
            font: 0.6rem /1.25rem "";
            color: #333;
            background: url(../images/chat_vidos1.png) 0.48rem center  no-repeat;
            background-size: 0.43rem auto;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
    }
    .imgs{
        position: relative;
        margin: 0 .675rem;
        .img{
            max-height: 7rem;
            max-width: 7rem;
        }
        .user-img-video{
            z-index: 999;
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background: url(../images/videoplay.png) no-repeat center rgba(0, 0, 0, 0.5);
            background-size: 1.5rem;
        }
        .vdo{
            max-width: 7rem;
            max-height: 7rem;
        }
    }
    
}
.chat{
    height: 100vh;
    width: 100vw;
    overflow: hidden;
    .mui-content{
        position: relative;
    }
    .mui-bar-nav ~ .mui-content{
        overflow: hidden;
    }
    .img-look.active{
        display: block;
    }
    .mui-popup .mui-popup-text{
        padding: 0;
        overflow: hidden;
    }
    .mui-popover{
        z-index: 9999;
    }
    #topPopover.pastebox{
        width: 3rem;
        .paste{
            width: 3rem;
        }
    }
    #topPopover.videobox{
        width: 5.5rem;
    }
    #topPopover.videobox2{
        width: 2.8rem;
    }
    .card-box{
        background-color: #fff;
    }
    a.gift-a {
        float: left;
    }
    .foot-link-box{
        display: flex;
        display: -webkit-flex;
        align-items: flex-end;
    }
}
.messages.cp{
    #topPopover.pastebox{
        height: 2.2rem;
        width: 3rem;
        .paste{
            width: 3rem;
        }
    }
    #topPopover.videobox2{
        width: 2.8rem;
        height: 2.2rem;
    }
    .mui-popover .mui-popover-arrow:after{
        background-color: #3f3939;
    }
    .mui-popover .mui-table-view{
        background-color: transparent;
    }
    .mui-popover{
        width: 8.3rem;
        height: 2rem;
        background-color: rgba(0, 0, 0, 0.75);
        box-shadow: 0px 10px 26px 0px rgba(0, 0, 0, 0.38);
    }
    .mui-popover .mui-scroll-wrapper{
        margin: 0;
    }
    .copy{
        color: #fff!important;
        text-align: center;
    }
}
/*******聊天**end*/
/*******引导页**star*/
.guide{
    #guide{
        width: 100%;
        height: 100vh;
        ul{
            width: 100%;
            height: 100vh;
            li{
                width: 100%;
                height: 100%;
            }
        }
        .swiper-wrapper{
            width: 100%;
            height: 100%;
        }
        .swiper-slide{
            width: 100%;
            height: 100%;    
            img{
                width: 100%;
                height: 100vh;
            }
        }
    }
}
/*******引导页**end*/
.circlefriends{
    overflow: hidden;
    .main{
        padding-bottom:0 ;
    }
}

/*******新消息**star*/
.newmag{
    .vdo{
        position: absolute;
        left: 14.3rem;
        top: 2.3rem;
        width: 1.25rem;
        height: 1.25rem;
        background: url(../images/vdoss.png) center no-repeat;
        background-size: 0.8rem 0.55rem;
    }
    .textwz{
        width: 3rem;
        margin-top: 0.5rem;
        float: left;
        word-wrap: break-word;
        height: 3rem;
        font: 0.5rem / .75rem "";
        overflow: hidden;
        display: -webkit-box;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical;
    }
    .mui-scroll-wrapper{
        background-color: #fff;
    }
    .con{
        width: 100%;
        padding-left: 0.75rem;
    }
    .cont{
        width: 100%;
        border-bottom: 1px solid #E6E6E6;
        overflow: hidden;
        position: relative;
    }
    .top{
        float: left;
        width: 2.25rem;
        height: 2.25rem;
        border-radius: 100000px;
        margin-top: 0.75rem;
        margin-right: 0.5rem;
    }
    .text{
        float: left;
        width: 10.45rem;
        margin-top: 0.75rem;
        margin-right: 1rem;
    }
    .name{
        font: 0.8rem /0.9rem "";
        color: #333;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .content{
        margin-top: 0.45rem;
        margin-bottom: 0.35rem;
        font: 0.7rem /0.9rem "";
        color: #333;
        word-wrap: break-word;
    }
    .time{
        font: 0.65rem /0.7rem "";
        color: #999;
        margin-bottom: 0.55rem;
    }
    .imgs{
        float: left;
        width: 3rem;
        height: 3rem;
        margin-top: 0.5rem;
    }
    .more{
        height: 2.65rem;
        font: 0.7rem / 2.65rem "";
        text-align: center;
        
        width: 100%;
        border-bottom: 1px solid #E6E6E6;
    }
    .face-bq{
        width: auto;
        max-width: 1.25rem;
        max-height: .9rem;
        vertical-align: middle;
        margin: .1rem;
    }
}
/*******新消息**end*/
.mui-slider-group{
    width: 100%;
    height: 100%;
}
.boxindex{
    background-color: #DD524D;
    width: 100%;
    height: 80%;
}
.lazy{
    opacity: 0;
}
